如何獲取JSON作爲Ajax $ .getJSON（）中的鍵和值？

我有這個Ajax代碼從Jobs.json文件獲取json。

Jobs.json代碼如下。

{ 
"jobs":[ 
    { 
    "Job":"Job1", 
    "Priority":"Low", 
    "DueDate":"11.03.2013", 
    "Iscompleted":"No" 
    }, 
    { 
    "Job":"Job2", 
    "Priority":"High", 
    "DueDate":"11.03.2013", 
    "Iscompleted" : "No" 
    }, 
    { 
    "Job":"Job3", 
    "Priority":"Medium", 
    "DueDate":"11.03.2013", 
    "Iscompleted":"No" 
    } 
    ] 
    }

現在我想重寫$。每個功能dynamically.That是，它將寫入JSON字符串作爲鍵和值，而不是.append（）。

來源

2013-03-11 ntf

這就走了過來動態每個職業的特性：

$.getJSON('Jobs.json', function(JSON){ 
    var $container = $('#result').empty(); 

    $.each(JSON.jobs, function(i, JOB) { 
     $.each(JOB, function(key, value) { 
      $container.append(key + ': ' + value + '<br />'); 
     }); 
     $container.append('<hr />'); 
    } 
});

Demo

來源

2013-03-11 14:53:50

對不起，它沒有工作。我不知道它爲什麼不工作，它看起來是正確的。 – ntf 2013-03-11 15:15:58

function callJobs（） \t { \t \t alert（「getting results ...」）; var $ container = $（'＃result'）; （key，value）{container.append（key +'：'+ value +'
'）; $ .each（JSON.jobs，function（i，JOB）{ }）; $ container.append（'

'）;}）; }我是這樣寫的。哪一個是錯的？ – ntf 2013-03-11 15:32:49

@ntf我在我的答案中添加了jsbin的鏈接。 – 2013-03-11 15:35:24

這裏是我的方法。我已經添加了評論來解釋這個過程。

$.each(JSON.jobs, function(i, JOB) { 
    // an empty array for the output values 
    var values = []; 
    // iterator over each property in the current JOB object 
    for (var prop in JOB) { 
     // add an item to the array in format "key: value" 
     values.push(prop + ': ' + JOB[prop]); 
    } 
    // join the array values using '<br />' as separator; 
    // append to #result and add an '<hr />' after 
    $('#result').append(values.join('<br />')).append('<hr />'); 
});

我對這個解決方案的目標是，以保持它的可讀性（在加入陣列的成本），選擇#result元素只有一次，而不必應付知道是否每個循環中添加最後<br /> 。其他解決方案在最後一個屬性之後和<hr />之前附加額外的<br />，而這和您的原始解決方案不相同。

來源

2013-03-11 14:55:07

我將這段代碼添加到了我的文件中，它工作。非常感謝。我也有一個問題。當更多的參數添加到Json文件中時，它會工作嗎？Key和值是否會傳遞？ – ntf 2013-03-11 15:13:27

@ntf：是的，隨着更多的參數添加它應該只是工作！另外，我看到你是新來的。您應該upvote /接受對您有幫助或爲您工作的答案。 – 2013-03-11 15:19:51

我喜歡這個，它是一個非常乾淨的解決方案。 +1 – 2013-03-11 15:25:07

如何獲取JSON作爲Ajax $ .getJSON（）中的鍵和值？

回答

相關問題