2014-04-29 85 views
0

我有下面的JSON数据,基本上我想要做的是用数组中包含的相关HTML填充几个div。尽管JSON数据循环来填充HTML

[{"id":"1","name":"profile title","html":"<h2 class=\"entry-title\" id=\"title\">Settings, Put something here?<\/h2>","typeId":"1"}, 
{"id":"2","name":"username","html":"<fieldset disabled><br><label for=\"nameinput\">Username<\/label><input type=\"text\" class=\"form-control\" placeholder=\"'.$name.'\" ><\/fieldset><p>","typeId":"1"}, 
{"id":"3","name":"date of birth","html":"<label for=\"dob\">Date of birth<\/label><input type=\"text\" name=\"dob\" class=\"form-control\" placeholder=\"01\/02\/2000\"><p>","typeId":"1"}] 

这里是JS:

$(document).ready(function(){ 
     $("#profile").one("click",function(){ 

       $.ajax({ 
        type: "GET", 
        url: ROOT+"controlpanel/profile", 
        dataType:"json", 
        success: function(data){ 

          $.each(data, function(id, data1) 
          { 

            $('#title').html(data1.html); 
            $('#container').append(data1.html); 
          }); 
         } 


     }); 
    }); 
}); 

我的问题是,我想在ID为1的HTML在不同的div去ID 2.

+0

数组中的每个元素都应该转到不同的div上吗? – milagvoniduak

回答

1

这个怎么样?

$(document).ready(function(){ 
    $("#profile").one("click",function(){ 
     $.ajax({ 
      type: "GET", 
      url: ROOT+"controlpanel/profile", 
      dataType:"json", 
      success: function(data){ 

       $.each(data, function(id, data1) 
       { 
        $('#title'+data.id).html(data1.html); 
        $('#container'+data.id).append(data1.html); 
       }); 
      } 
     }); 
    }); 
}); 

当然,如果你的JSON数组可以是任意宽度对,有机会,你还没有把在内容的元素。你可以建立HTML以保持环路内的数据。或者您可以使用隐藏的html模板,并使用jquery.clone()来复制它,然后将其填充到循环中。您可以使用jquery.append()将所有html片段添加到同一个容器中,可能包装在一个div中。你可以用jquery('div', {})创建一个新元素,将该元素附加到某个地方并将你的html添加到这个新的div中。

有很多方法来处理这个问题。我希望这可以帮助你。如果您需要更详细的建议,请在您的问题中提供更多详细信息。