jquery - 在jquery中访问json值的问题

Question

这是我的 JSON 字符串：

{"success":true,"docSearch":
 [
  {"fName":"Sam",
   "lName":"Mehra",
   "email":"[e-mail]",
   "mobile":"7859857230",
   "userImage":"IMG/patient.png",
   "address":"412/A Ganesh Nagar 2 gali no.1 Laxmi Nagar Near Ajay cycles, Mona Pg",
   "special":"Allergist, Dentist, Anesthesiologist, Cardiologist",
   "deg":"MBBS, BDS, BAMS, BUMS","experience":"3","fees":"3"},
   {"fName":"Samanyu",
    "lName":"Mehra",
    "email":"[e-mail]",
    "mobile":"7859857230",
    "userImage":"IMG/regis.jpg",
    "address":"412/A Ganesh Nagar 2 gali no.1 Laxmi Nagar Near Ajay cycles, Mona Pg",
    "special":"Allergist, Dentist, Anesthesiologist, Cardiologist, Dermatologist",
    "deg":"MBBS, BDS, BAMS, BUMS, BHMS, BYNS",
    "experience":"3",
    "fees":"3"
    }
  ]
}

我想访问 jQuery 中的值。到目前为止，我这样做了：

success: function(data,textStatus,jqXHR){
            if(data.success){
                var img=document.createElement('img');
                $(data).each(function(index,item){
                $("#ajaxResponse").html("");
                $("#ajaxResponse").append("<b>First Name:</b> " + data.docSearch[index].fName+"<br>");
                $("#ajaxResponse").append("<b>Last Name:</b> " + data.docSearch[index].lName+"<br>");
                $("#ajaxResponse").append("<b>Email:</b> " + data.docSearch[index].email+"<br>");
                $("#ajaxResponse").append("<b>Experience:</b> " + data.docSearch[index].experience+"<br>");
                $("#ajaxResponse").append("<b>Fees:</b> " + data.docSearch[index].fees+"<br>");
                img.src=data.docSearch[index].userImage;
                $("#ajaxResponse").append(img);
                });
            } 

如果有人阅读本文知道如何访问这样的 JSON 字符串，请帮助我。注意：此 JSON 字符串还可以包含 1 个值，例如：

    {"success":true,"docSearch":
 [
  {"fName":"Sam",
   "lName":"Mehra",
   "email":"[e-mail]",
   "mobile":"7859857230",
   "userImage":"IMG/patient.png",
   "address":"412/A Ganesh Nagar 2 gali no.1 Laxmi Nagar Near Ajay cycles, Mona Pg",
   "special":"Allergist, Dentist, Anesthesiologist, Cardiologist",
   "deg":"MBBS, BDS, BAMS, BUMS","experience":"3","fees":"3"}
]
    }

编辑1：

    success: function(data,textStatus,jqXHR){
        //doc Name was correct so we have some information to display   
        if(data.success){
            var img=document.createElement('img');
            var br=document.createElement('br');
            $("#ajaxResponse").html("");
            $(data.docSearch).each(function(index,item){
            $("#ajaxResponse").append("<b>First Name:</b> " + item.fName+"<br>");
            $("#ajaxResponse").append("<b>Last Name:</b> " + item.lName+"<br>");
            $("#ajaxResponse").append("<b>Email:</b> " + item.email+"<br>");
            $("#ajaxResponse").append("<b>Usernames:</b> " + item.username+"<br>");
            $("#ajaxResponse").append("<b>Experience:</b> " + item.experience+"<br>");
            $("#ajaxResponse").append("<b>Fees:</b> " + item.fees+"<br>");
            img.src=item.userImage;
            $("#ajaxResponse").append(img);
            $("#ajaxResponse").append(br);
            });
        } 
             //display error message
             else {
                 $("#ajaxResponse").html("<div><b>No Record Found!!</b></div>");
             }
        },

我添加了一个 <'br'> 标记，以便在显示的两个内容之间有一个换行符，但是没有换行符，它也没有显示 2 个图像。对于第一次迭代，它只是读取它并只留下它，而对于第二次迭代，它正在显示图像。我想要两个数据 2 显示图像。请帮忙 ！！

编辑2： 我的问题通过保持var img=document.createElement('img');在循环中得到解决，这样每​​当它为图像设置路径时，它就会显示图像。

标签： jqueryjson

Answer 1

您已经使用 foreach 循环错误的变量。使用 foreach 循环而data.docSearch不是 for data。

var data = {"success":true,"docSearch":
 [
  {"fName":"Sam",
   "lName":"Mehra",
   "email":"[e-mail]",
   "mobile":"7859857230",
   "userImage":"IMG/patient.png",
   "address":"412/A Ganesh Nagar 2 gali no.1 Laxmi Nagar Near Ajay cycles, Mona Pg",
   "special":"Allergist, Dentist, Anesthesiologist, Cardiologist",
   "deg":"MBBS, BDS, BAMS, BUMS","experience":"3","fees":"3"},
   {"fName":"Samanyu",
    "lName":"Mehra",
    "email":"[e-mail]",
    "mobile":"7859857230",
    "userImage":"IMG/regis.jpg",
    "address":"412/A Ganesh Nagar 2 gali no.1 Laxmi Nagar Near Ajay cycles, Mona Pg",
    "special":"Allergist, Dentist, Anesthesiologist, Cardiologist, Dermatologist",
    "deg":"MBBS, BDS, BAMS, BUMS, BHMS, BYNS",
    "experience":"3",
    "fees":"3"
    },{"fName":"Sandeep",
   "lName":"Mehra",
   "email":"[e-mail]",
   "mobile":"7859857230",
   "userImage":"IMG/patient.png",
   "address":"412/A Ganesh Nagar 2 gali no.1 Laxmi Nagar Near Ajay cycles, Mona Pg",
   "special":"Allergist, Dentist, Anesthesiologist, Cardiologist",
   "deg":"MBBS, BDS, BAMS, BUMS","experience":"3","fees":"3"},
   {"fName":"Samanyu",
    "lName":"Mehra",
    "email":"[e-mail]",
    "mobile":"7859857230",
    "userImage":"IMG/regis.jpg",
    "address":"412/A Ganesh Nagar 2 gali no.1 Laxmi Nagar Near Ajay cycles, Mona Pg",
    "special":"Allergist, Dentist, Anesthesiologist, Cardiologist, Dermatologist",
    "deg":"MBBS, BDS, BAMS, BUMS, BHMS, BYNS",
    "experience":"3",
    "fees":"3"
    }
  ]
}


$(data.docSearch).each(function(index,item){
                console.log(item.fName);
                });

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>