我正在尝试将Ajax加载到两个不同的div中

Question

我正在尝试将ajax加载到两个不同的div中，但是我检查了控制台，并且网页仍然将数据放入一个div中，即使它在ajax代码中被调用为两个不同的div。

<script>$(document).ready(function(){

    $.ajax({
      url: "http://developer.api.cnet.com/rest/v1.0/techProductSearch",
      type: "get",
      data: { viewType:"json", iod: "none", callback: "phone", partKey:"2nnae6wsj2w72yqhcwu4v7sg", partTag:"2nnae6wsj2w72yqhcwu4v7sg", query: "iphone 5", productId:"31303113" },
      dataType: "jsonp",
      success: ipod
    });

    });
    function ipod(data) {
var count = 0;
    console.log(data);
$.each(data.CNETResponse.TechProducts.TechProduct, function(index,value) {

    console.log("Name: "+data.CNETResponse.TechProducts.TechProduct[count].Name.$);
    var datastring = '<tr>'+'<td class="searchItem">'+data.CNETResponse.TechProducts.TechProduct[count].Name.$+'</td> </tr>';
    $('#tabs-1').append(datastring);
    console.log("$('#tabs-1').append(datastring)");

    count ++;
    });
         }</script>
         <script>$(document).ready(function(){

    $.ajax({
      url: "http://developer.api.cnet.com/rest/v1.0/techProductSearch",
      type: "get",
      data: { viewType:"json", iod: "none", callback: "phone", partKey:"2nnae6wsj2w72yqhcwu4v7sg", partTag:"2nnae6wsj2w72yqhcwu4v7sg", query: "Samsung Note 3", productId:"31303113" },
      dataType: "jsonp",
      success: ipod
    });

    });
    function ipod(data) {
var count = 0;
console.log(data);
$.each(data.CNETResponse.TechProducts.TechProduct, function(index,value) {

    console.log("Name: "+data.CNETResponse.TechProducts.TechProduct[count].Name.$);
    var datastring = '<tr>'+'<td class="searchItem">'+data.CNETResponse.TechProducts.TechProduct[count].Name.$+'</td> </tr>';
    $('#tabs-2').append(datastring);
    console.log("$('#tabs-2').append(datastring)");
    count ++;
    });
     }</script>

HTML

<div id="tabs-1">
<p></p>
</div>
<div id="tabs-2">
<p></p>
</div>

Answer 1

您有两个函数都称为ipod。 您需要给他们一个唯一的名称，否则一个将覆盖另一个。 调用第二个“ ipod2”，然后将第二个ajax调用设置为使用ipod2作为成功回调。

Answer 2

<script>

    $(document).ready(function(){

        $.ajax({
          url: "http://developer.api.cnet.com/rest/v1.0/techProductSearch",
          type: "get",
          data: { viewType:"json", iod: "none", callback: "phone", partKey:"2nnae6wsj2w72yqhcwu4v7sg", partTag:"2nnae6wsj2w72yqhcwu4v7sg", query: "iphone 5", productId:"31303113" },
          dataType: "jsonp",
          success: ipod
        });

    });

    function ipod(data) {

        $.each(data.CNETResponse.TechProducts.TechProduct, function(i,v) {

            var datastring = '<div class="searchItem">'+v[i].Name + '</div>';
            $('#tabs-'+ i).append(datastring);

        });
     };

 </script>