jQuery内部div标签动态绑定

时间:2012-02-21 15:44:03

标签: jquery

   $.ajax({
       type: "POST",
       url: "AdvService.asmx/GetDetails",
       data: "{}",
       contentType: "application/json; charset=utf-8",
       dataType: "json",
       success: function (response) {
           var cars = response;
           $('#cn_list').empty();
           var i = 1;
           $.each(cars, function (index, MyData) {
               if (i % 10 == 0) {
                   $('#cn_list').append('<div class=cn_page></div>');
               }
               $('#cn_list .cn_page:last').append('<div class=cn_item selected><center style=vertical-align:middle><h2></h2>' + MyData.Productname + '</center></div><div class="cn_nav">' + '<a id="cn_prev" class="cn_prev disabled"></a>' + '<a id="cn_next" class="cn_next"></a>' + '</div>');
               i++;
           });
       },
       failure: function (msg) {
           $('#cn_list').text(msg);
       }
   });

它将返回<div>并关闭</div>,但我需要<div>和jQuery循环内容然后关闭<div>标记,该怎么做?

对不起混淆

看我以前 Jquery product display in <div> tag

我逐一得到结果100结果,所以我使用下面的部分来管理

            $('#cn_list').append('<div class="cn_page"></div>')

我在firefox的响应中可以看到什么。 http://i.stack.imgur.com/X4nuF.png

应该是

http://i.stack.imgur.com/7ENNr.png

1 个答案:

答案 0 :(得分:0)

jQuery只附加完整的DOM元素。您需要将HTML构建为字符串,然后将其附加到DOM。

尝试这样的事情(未经测试):

   success: function (response) {
       var cars = response, i = 1, HTML = '';
       $.each(cars, function (index, MyData) {
           if (i % 10 == 0) {
               HTML += '<div class=cn_page>';
           }
           HTML += '<div class=cn_item selected><center style=vertical-align:middle><h2></h2>' + MyData.Productname + '</center></div><div class="cn_nav">' + '<a id="cn_prev" class="cn_prev disabled"></a>' + '<a id="cn_next" class="cn_next"></a>' + '</div>';
           if (i % 10 == 0) {
               HTML += '</div>';
           }
           i++;
       });
       $('#cn_list').html(HTML);
   }