如何在jquery中從json文件中搜索和檢索數據？

我有一個json文件，下面的數據。如何在jquery中從json文件中搜索和檢索數據？

{"student1":[{"id":1,"name":"Test Data1","email":"[email protected]"}]} 

{"student2":[{"id":2,"name":"Test Data2","email":"[email protected]"}]} 

{"student3":[{"id":3,"name":"Test Data3","email":"[email protected]"}]} 

{"student4":[{"id":4,"name":"Test Data4","email":"[email protected]"}]}

而我使用$ .getJSON方法檢索，但數據不會輸出。而且我想用像student3那樣的Key來搜索數據，那麼student3的數據將不得不輸出。這是我的JQuery代碼。

$.getJSON("test.json", function(data) { 
      var items = []; 
      $.each(data, function(key, val) { 
      items.push("<li id='" + key + "'>" + val + "</li>"); 
      }); 

      $("<ul/>", { 
      "class": "my-new-list", 
      html: items.join("") 
      }).appendTo("body"); 
    });

這是我的完整源代碼。

<!DOCTYPE html> 
<html> 
    <head> 
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.2.1/jquery.min.js"></script> 
    <title>Test Json</title> 
    </head> 
    <body> 
    <input type="text" name="name" id="name"> 
    <input type="text" name="email" id="email"> 
    <input type="button" name="submit" id="submit" value="Submit" onclick="submitForm()"> 
    <input type="button" name="edit" id="edit" value="Edit" onclick="Edit()"> 
    <br><br> 
    <div></div> 
</body> 

<script type="text/javascript"> 
    function submitForm(){ 
    var name = $("#name").val(); 
    var email = $("#email").val(); 
    var obj = { 
     table: [] 
    }; 
    obj.table.push({id: 1, name:name, email:email}); 
    var json = JSON.stringify(obj); 
    $.ajax 
    ({ 
     type: "GET", 
     dataType : 'json', 
     url: 'save_json.php', 
     data: { data: json }, 
     success: function() {alert("Thanks!"); }, 
     failure: function() {alert("Error!");} 
    }); 
    $("#name").val(''); 
    $("#email").val(''); 
} 


    function Edit(){ 
    $.getJSON("general.json", function(data) { 

      var items = []; 
      $.each(data, function(key, val) { 
      items.push("<li id='" + key + "'>" + val + "</li>"); 
      }); 

      $("<ul/>", { 
      "class": "my-new-list", 
      html: items.join("") 
      }).appendTo("body"); 
    }); 
    } 
</script> 
</html>

來源

2017-06-16 Kawazoe Kazuke

你必須在該文件的不是JSON，它是4個不同的對象。由於它的格式，你無法檢索它。您需要將其轉換爲單個對象並使用'。.getScript（）'，或將其更改爲JSON並使用您當前的邏輯。 –

你能帶我看樣品嗎？我是小白。請... –

請在下面添加代碼。

$(document).ready(function(){ 
    $.getJSON("test.json", function(data) { 
      var items = [];  

    $.each(data, function(key, val) { 
     $.each(val, function(key2, val2) { 
      items.push("<li id='" + key2 + "'>" +val2[0].name + "</li>"); 
     }); 
     }); 

      $("<ul/>", { 
      "class": "my-new-list", 
      html: items.join("") 
      }).appendTo("body"); 
    }); 
});

也刪除student1，STUDENT2並使用唯一的學生，並使用鍵找到值。

您的json數據將如下所示。

[{"student":[{"id":1,"name":"Shyam","email":"[email protected]"}]}, 
{"student":[{"id":1,"name":"Niraj","email":"[email protected]"}]}, 
{"student":[{"id":1,"name":"Mehul","email":"[email protected]"}]}, 
{"student":[{"id":1,"name":"Ritesh","email":"[email protected]"}]}]

讓我知道它是否無效。

來源

2017-06-16 10:09:48

這是工作兄弟。謝謝。但我的JSON數據添加格式不像那個兄弟。我會告訴你代碼。 –

Ohk兄向我展示代碼，以便我可以正確理解。 –

我上面更新了我的問題兄弟。請指導我並幫助我。 –

你可以試試這個代碼/語法可能不正確....

searchParam是「學生三」 ..

$.getJSON("test.json", function(data , searchParam) { 
       var items = []; 
var filterObj =data[searchParam]; 
if(filterObj != undefined) 
{ 
       var parsedData = Json.Parse(filterObj); 
       $.each(parsedData , function(key, val) {     
       items.push("<li id='" + key + "'>" + val + "</li>"); 
       }); 

       $("<ul/>", { 
       "class": "my-new-list", 
       html: items.join("") 
       }).appendTo("body"); 
     }); 
}

來源

2017-06-16 10:18:30 KB1788

如何在jquery中從json文件中搜索和檢索數據？

回答

相關問題