2013-06-22 4 views
1

У меня есть объект javascript, который я получил из файла JSONP.Поиск свойств в объекте javascript

Объект содержит несколько «опций» и «результатов», которые используются для настройки html на странице при нажатии пользователем.

Прямо сейчас, я могу проверить, существует ли строка HTML (вставленная через ссылку json) в json-файл. То, что я хочу сделать, это взять эту строку, найти следующий «результат» или «вариант» в json-файле, а затем вернуть значение «option» или «result», чтобы я мог использовать его для изменения html ...

Как это сделать? Я пытаюсь использовать метод .indexOf для поиска текущего индекса, но это действительно не помогает мне найти конкретное свойство, например «вариант».

Это код, который я использую для итерации через файл JSONP и определения текущей строки.

$.ajax({ 
    url: "http://www.myurl.com/jsonp.php", 
    type: "GET", 
    dataType: "jsonp", 
    jsonpCallback: "otmjsonp", 
    async: false, 
    success: function (JSON) { 
     $(".result").on("click", function() { 
      var currentResult = $(this).text(); //.result is the line of HTML the user has clicked 
      for (var playerSelection in JSON) { 
       if (JSON.hasOwnProperty(playerSelection)) { 
        if (JSON[playerSelection] === currentResult) { 
         alert("this selection exists in the JSON"); 
        } 
       } 
      } 
     }) 
    } 
}); 

И здесь очень простая версия большого JSONP файла:

otmjsonp({ 
"situation1" : "Your opponent is trying to tackle you", "playerPrompt1" : "What will you do first?", 

"option1" : "avoid him", 

    "result1" : "he tackles you", 

     "situation2" : "you were tackled", "playerPrompt2" : "Your opponent begins to slow down", 

     "option2" : "chase after him", 
      "result2" : "you caught up", 
)} 

и т.д. и т.п.

Даже туманные идеи/направления будут оценены, как я полностью застрял.

+1

Должен ли файл JSONP быть в таком формате? Он выглядит неструктурированным, и именно это затрудняет его работу. –

+0

'currentResult' выходит за рамки. Вы объявляете его внутри функции, что означает, что к нему нельзя получить доступ извне. Возможно, вы захотите поставить инструкцию 'var currentResult' на несколько уровней выше. На самом деле, когда я думаю об этом, это также странно, что вы определяете обработчик события click внутри функции успеха. Есть ли причины для этого? – basilikum

+0

@RaulMartins Чтобы решить эту проблему, я попытался как можно больше упростить файл JSONP - у него были вложенные уровни, теперь все на одном уровне. Какую еще структуру вы бы предложили? –

ответ

1

Часть вопроса здесь заключается в том, как вы связали свой интерфейс с инициализацией данных. Я думаю, что вы действительно хотите сделать это, чтобы отделить запрос JSON, получая данные от обработки щелчка.

$(function() { 

    var setupHTML, 
     handleClick, 
     updateHTML, 
     originalData, 
     resultData; 

    updateHTML = function(JSON) { 
    // Add or activate the html the person is clicking 
    $('.result').text() 
    }; 

    handleClick = function(e) { 
    var currChoice = $(e.target).text(); 

    if (resultData === undefined) { 
     e.stopPropagation(); 
     e.preventDefault(); 
     return; 
    } 

    for (var ps in resultData) { 
     if (resultData.hasOwnProperty(ps) && resultData[ps] === currChoice) { 
     resultData = resultData[ps]; 
     updateHTML(resultData); 
     } 
    } 
    } 

    $('.result').on('click', handleClick) 


    $.ajax({ 
    url: "http://www.myurl.com/jsonp.php", 
    type: "GET", 
    dataType: "jsonp", 
    jsonpCallback: "otmjsonp", 
    async: false, 
    success: function(data) { 
     resultData = origData = data; 

     // make the UI visible 
     setupHTML(JSON); 
    } 
    }); 

}); 
+0

Спасибо, это то, что мне нужно. –

1

Если вы переструктурируете свой JSON для вставки параметров/результата внутри соответствующего родителя, становится легко получить все возможные варианты. Вы должны изменить свой код на этот:

$.ajax({ 
url: "http://www.myurl.com/jsonp.php", 
type: "GET", 
dataType: "jsonp", 
jsonpCallback: "otmjsonp", 
async: false, 
success: function (JSON) { 
    $(".result").on("click", function() { 
     var currentResult = $(this).text(); //.result is the line of HTML the user has clicked 

    if (JSON.hasOwnProperty(playerSelection)) { 
     for (var outcome in JSON[playerSelection]) { 
     if (JSON[playerselection].hasOwnProperty(outcome)) { 
     alert("This is the next outcome " + JSON[playerSelection][outcome]); 
     } 
     } 
    } 
    }) 
    } 
}); 
+0

Спасибо, это помогло мне - upvote. –

0

Вы можете получить доступ к свойству объекта, как: Object.property или Object['some property']. Вы можете использовать for in цикл для перебора объектов, и большинство Массивы, как:

var property, value; 
for(var i in Object){ 
    property = i; 
    value = Object[i]; 
} 
1

Я хотел бы предложить продумать и организовать структуру JSON, прежде чем переходить гораздо дальше. Организованный и логичный JSON упростит Javascript. Для этой ситуации - столько, сколько я могу почерпнуть из описания и примера - я думаю, структуру JSON, что бы сделать логический смысл и оказаться полезными в дальнейшей Javascript может выглядеть примерно так:

{ 
    'situations': [ 
    { 
     'description': 'Your opponent is trying to tackle you.', 
     'prompt': 'What will you do?', 
     'options': [ 
     { 
      'action': 'Avoid him.', 
      'result': 'He tackles you.' 
     }, 
     { /* another option (an action plus a result) */ } 
     ] 
    }, 
    { /* another situation (a description, a prompt, and an array of options) */ } 
    ] 
} 

Я знаю, что это это не полный ответ на вашу проблему, но я думаю, что было бы неплохо начать переосмысливать ваш подход.

+0

Спасибо за указатель –