Question

我有一个包含以下数据的json文件。

{"student1":[{"id":1,"name":"Test Data1","email":"test1@g.com"}]}

{"student2":[{"id":2,"name":"Test Data2","email":"test2@g.com"}]}

{"student3":[{"id":3,"name":"Test Data3","email":"test3@g.com"}]}

{"student4":[{"id":4,"name":"Test Data4","email":"test4@g.com"}]}

我使用$ .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>

Answer 1

请添加以下提及的代码。

$(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":"test@g.com"}]},
{"student":[{"id":1,"name":"Niraj","email":"test@g.com"}]},
{"student":[{"id":1,"name":"Mehul","email":"test@g.com"}]},
{"student":[{"id":1,"name":"Ritesh","email":"test@g.com"}]}]

如果不起作用，请告诉我。

Answer 2

您可以尝试此代码/语法可能不正确....

searchParam将是'Student3'..

 $.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" );
        });
}

如何在Jquery中从json文件中搜索和检索数据？

2 个答案: