Javascript jQuery数据表-我可以填写div吗？

我不熟悉jQuery数据表，当ajax调用返回数据时遇到问题。如何使用数据集而不是表格？我需要填补空缺。其结构与表相似：

  <div id="wrap">
            <div class="drow">                
                <div class="dcol1">
                /*data*/
                </div>
                <div class="dcol2">
                /*data*/
                </div>                       
            </div>
            <div class="drow">                
                <div class="dcol1">
                /*data*/
                </div>
                <div class="dcol2">
                /*data*/
                </div>                       
            </div>
            <div class="drow">                
                <div class="dcol1">
                /*data*/
                </div>
                <div class="dcol2">
                /*data*/
                </div>                       
            </div>
    </div>

/*资料*/
/*资料*/
/*资料*/
/*资料*/
/*资料*/
/*资料*/

---

有什么想法吗？

你可以像下面这样循环浏览div

$('#wrap .drow').each(function(){
    //populate the dcol1
    $(this).find('.dcol1').text(desiredData);
    //populate the dcol2
    $(this).find('.dcol2').text(desiredData);
});

var resp; //your json response
var dataArr = resp.data;
$('#wrap .drow').each(function(index){
     //populate the dcol1
     $(this).find('.dcol1').text(dataArr[index].dcol1);
     //populate the dcol2
     $(this).find('.dcol2').text(dataArr[index].dcol2);
 });

需要查看响应json结构以进一步提供帮助

现在，让我们看看json响应的结构如下：

{
  data: [
     {
        "dcol1": "some data1",
        "dcol2": "some data1"
     },
     {
        "dcol1": "some data2",
        "dcol2": "some data2"
     },
     .........
     {
        "dcol1": "some dataN",
        "dcol2": "some dataN"
     }         
  ]
}

所以，你可以像下面这样做

$('#wrap .drow').each(function(){
    //populate the dcol1
    $(this).find('.dcol1').text(desiredData);
    //populate the dcol2
    $(this).find('.dcol2').text(desiredData);
});

var resp; //your json response
var dataArr = resp.data;
$('#wrap .drow').each(function(index){
     //populate the dcol1
     $(this).find('.dcol1').text(dataArr[index].dcol1);
     //populate the dcol2
     $(this).find('.dcol2').text(dataArr[index].dcol2);
 });

---

我不知道你是如何得到回应的。 但它在这里，可能对你有帮助

$.ajax({
键入：“获取”，
url:“您的web服务url”，
cache:false，
成功：功能（res）{
$.each（res，function（i，index）{
var responseObject=res[i]；
$（“#wrap”）.empty（）；
$（“#wrap”）.append（'responseObject.firstNameresponseObject.firstName'）；
});
//它将循环通过您的响应对象，并按照您的格式追加数据
},
错误：函数（e）{
警惕（“出了差错”）；
}
}); //ajax调用结束

我已经为您的帮助树立了榜样，如果需要进一步帮助，请检查并告知我

请注意，我使用返回数据作为JSON格式

JSON:

[{"drow":[{"dcol1":"dcol1_value","dcol2":"dcol2_value"}]},
{"drow":[{"dcol1":"dcol1_value","dcol2":"dcol2_value"}]}]

HTML:

<div id="wrap"></div>

JQ:

$（文档）.ready（函数（）{
变量d=[{“drow”：[{“dcol1”：“dcol1\u值”，“dcol2”：“dcol2\u值”}]，
{“drow”：[{“dcol1”：“dcol1_值”，“dcol2”：“dcol2_值”}]}]；
//循环d的项目
$。每个（d，功能（索引，项目）{
drowDiv=''；
dcol1Div=''；
dcol2Div=''；
$.each（item.drow，函数（子索引，子项）{
dcol1Div=''+子项。dcol1+''；
dcol2Div=''+子项。dcol2+''；
drowDiv=''+dcol1Div+dcol2Div+''；
});
$（“#wrap”）.append（drowDiv）；
});
});

结果:

<div id="wrap">
        <div class="drow">
                <div class="dcol1">dcol1_value</div>
                <div class="dcol2">dcol2_value</div>
        </div>
        <div class="drow">
                <div class="dcol1">dcol1_value</div>
                <div class="dcol2">dcol2_value</div>
        </div>
</div>

dcol1_值
dcol2_值
dcol1_值
dcol2_值

---

这个东西在.

也很活跃，所以基本上你想在

结构上使用数据表，而不是

结构？这永远不会发生。dataTables通过注入和删除

元素来不断地操作DOM，如果您不使用AJAX或未指定列，则需要存在

和

。表元素的使用在插件中是硬编码的。