Помощь в программе с функцией ввода и обратного вызова JSONP

У меня возникли проблемы с написанием этого кода, который будет использовать метод вставки меток JSONP и функцию обратного вызова. Я должен использовать http://legacy.jefferson.kctcs.edu/users/mark.prather/states.txt для URL. Это пример того, что на веб-страницеПомощь в программе с функцией ввода и обратного вызова JSONP

function getStateData([ 
{State:"Alabama", Abbreviation:"AL", Statehood:1819, Capital:"Montgomery"}, 
{State, "Alaska", Abbreviation:"AK", Statehood:1959, Capital:"Juneau"}, 
{State:"Arizona", Abbreviation:"AZ", Statehood:1912, Capital:"Phoenix"}, 
]);

я должен использовать getStateData (SDATA) в качестве имени mycallback и SDATA предполагается хранить данные массива. Затем у меня должна быть форма, которая позволяет пользователю выбирать состояние и получать запрошенные данные, которые являются государством, аббревиатурой, государственностью и капиталом. Ниже приведена часть моей формы.

<form> 
    <p> 
     <select> 
      <option value="AL" selected>Alabama</option> 
      <option value="AK">Alaska</option> 
      <option value="AZ">Arizona</option> 
     </select> 
    </p> 
</form>

Моя самая большая проблема заключается в том, что URL-адрес уже является функцией вместо необработанных данных. Я не ищу раздаточные материалы, просто помогу. Это то, что я получил до сих пор. Любая помощь будет высоко оценена. https://jsfiddle.net/MaNBeAsT515/ppp0dxwm/2/

источник

2015-05-02 Robert C Herrington

Во-первых, есть две вещи, которые нужно изменить, чтобы получить эту работу в jsfiddle:

Поскольку вы вызываете службу, которая поддерживает только HTTP, вы не можете использовать jsfiddle, который использует протокол HTTPS.
Вам нужно изменить jsfiddle, чтобы JavaScript находился в элементе <head>. Это связано с тем, что ваша функция должна находиться в глобальной области действия, поскольку вы вызываете ее из атрибута onclick.

После этого, я думаю, вам просто нужно изменить, как вы имеете дело с возвращенными данными. Это массив, но вы хотите получить данные для одного состояния, используя его аббревиатуру. Один из способов борьбы с этим - создать объект карты из массива.

jsfiddle

Вот функция, которая преобразует массив в карте объекта:

function createStateMap(states) { 
    var map = {}; 
    states.forEach(function(state) { 
     map[state.Abbreviation] = state; 
    }); 
    return map; 
}

Я не делаю это в приведенном выше jsfiddle, но я думаю, вы должны удалите ранее вставленный элемент <script> перед созданием нового. Вероятно, вы также должны установить атрибут type элемента <script>.

function insertURL() { 
    var oldScript = document.getElementById('stateScript'); 
    if (oldScript) { 
     oldScript.parentNode.removeChild(oldScript); 
    } 

    var url = " http://legacy.jefferson.kctcs.edu/users/mark.prather/states.txt"; 
    var newScript = document.createElement('script'); 
    newScript.setAttribute('id', 'stateScript');     
    newScript.setAttribute('type', 'text/javascript');     
    newScript.setAttribute('src', url);     
    document.getElementsByTagName('head')[0].appendChild(newScript); 
}

jsfiddle

источник

2015-05-02 06:18:31

Хорошо спасибо. Это был мой первый раз, когда я использовал jsfiddle с таким вопросом. –

@RobertCHerrington - Это был мой первый звонок из jsonp. Я удалил свой ответ, который показал, как это сделать с помощью JQuery, потому что я решил, что вы действительно этого не хотели. Если вы хотите это увидеть, я могу восстановить его. –

Хорошо, спасибо за помощь! Я сделаю некоторое сравнение с тем, как/что я должен был сделать, чтобы мой первый раз. –

Помощь в программе с функцией ввода и обратного вызова JSONP

ответ

Смежные вопросы