Javascript 使用jquery动态创建2列表

我正在尝试使用ajax调用动态生成一个表。为了简化事情，我刚刚将代码添加到js fiddle中->

单击“HI”按钮时，前两列将正确创建。。但是，当td长度达到2时，有些人会这样做。它不会创建另一行。原因是，当我在表元素上查找时，实际上是在检索子表元素。有人能帮忙吗

我想要一张两列的桌子。。多谢各位

示例代码：

var tr = $("#maintable tbody tr:first");

if(!tr.length || tr.find("td:first").length >= max) {
    $("#maintable").append("<tr>");
}
if(count==0) {
    $("#maintable tr:last").append("<td>hi"+content+"</td>");
}

var tr=$（“#主表tbody tr:first”）；
如果（！tr.length | | tr.find（“td:first”）.length>=max）{
$（“#主表”）。追加（“”）；
}
如果（计数=0）{
$（“#maintable tr:last”）.append（“hi”+content+”）；
}

基本上，后代的匹配允许曾孙等。只是需要使匹配更加具体

JSFiddle：

max=2
$（“按钮”）。单击（函数（）{
var content=$（'#template'）.html（）；
var$table=$（“#主表”）；
var tr=$table.find（“>tbody>tr:last”）；
如果（！tr.length | | tr.find（“>td”）.length>=max）{
//追加空行
tr=$（“”）；
$table.append（tr）；
}
tr.append（“hi”+内容+”）；
});

这一行总是以最后一行为目标，如果它根本不存在（或者已经有太多div），则添加一行，这是我收集您想要的

---

我还使用了我建议的模板将凌乱的HTML字符串从代码中分离出来。

基本上，后代的匹配允许曾孙等。只是需要使匹配更加具体

JSFiddle：

max=2
$（“按钮”）。单击（函数（）{
var content=$（'#template'）.html（）；
var$table=$（“#主表”）；
var tr=$table.find（“>tbody>tr:last”）；
如果（！tr.length | | tr.find（“>td”）.length>=max）{
//追加空行
tr=$（“”）；
$table.append（tr）；
}
tr.append（“hi”+内容+”）；
});

这一行总是以最后一行为目标，如果它根本不存在（或者已经有太多div），则添加一行，这是我收集您想要的

---

我还使用了我建议的模板将凌乱的HTML字符串从代码中分离出来。

基本上，后代的匹配允许曾孙等。只是需要使匹配更加具体

JSFiddle：

max=2
$（“按钮”）。单击（函数（）{
var content=$（'#template'）.html（）；
var$table=$（“#主表”）；
var tr=$table.find（“>tbody>tr:last”）；
如果（！tr.length | | tr.find（“>td”）.length>=max）{
//追加空行
tr=$（“”）；
$table.append（tr）；
}
tr.append（“hi”+内容+”）；
});

这一行总是以最后一行为目标，如果它根本不存在（或者已经有太多div），则添加一行，这是我收集您想要的

---

我还使用了我建议的模板将凌乱的HTML字符串从代码中分离出来。

基本上，后代的匹配允许曾孙等。只是需要使匹配更加具体

JSFiddle：

max=2
$（“按钮”）。单击（函数（）{
var content=$（'#template'）.html（）；
var$table=$（“#主表”）；
var tr=$table.find（“>tbody>tr:last”）；
如果（！tr.length | | tr.find（“>td”）.length>=max）{
//追加空行
tr=$（“”）；
$table.append（tr）；
}
tr.append（“hi”+内容+”）；
});

这一行总是以最后一行为目标，如果它根本不存在（或者已经有太多div），则添加一行，这是我收集您想要的

---

我还使用了我建议的模板将凌乱的HTML字符串从代码中分离出来。

在增加新表行之前，您需要检查表单元格的长度。达到最大列长度后，重置行并重新开始

max_columns=2；
计数=0；
$（“按钮”）。单击（函数（）{
var content='column'；
if（count==max_columns | |！$（'#maintable tr'）.length）{
$（“#主表”）。追加（“”）；
计数=0；
}
如果（计数！=最大列数）
$（“#maintable tr:last”）.append（“+content+”）；
其他的
$（“#maintable tr:first”）.append（“+content+”）；
计数++；
});

在递增新表行之前，您需要检查表单元格的长度。达到最大列长度后，重置行并重新开始

max_columns=2；
计数=0；
$（“按钮”）。单击（函数（）{
var content='column'；
if（count==max_columns | |！$（'#maintable tr'）.length）{
$（“#主表”）。追加（“”）；
计数=0；
}
如果（计数！=最大列数）
$（“#maintable tr:last”）.append（“+content+”）；
其他的
$（“#maintable tr:first”）.append（“+content+”）；
计数++；
});

在递增新表行之前，您需要检查表单元格的长度。达到最大列长度后，重置行并重新开始

max_columns=2；
计数=0；
$（“按钮”）。单击（函数（）{
var content='column'；
if（count==max_columns | |！$（'#maintable tr'）.length）{
$（“#主表”）。追加（“”）；
计数=0；
}
如果（计数！=最大列数）
$（“#maintable tr:last”）.append（“+content+”）；
其他的
$（“#maintable tr:first”）.append（“+content+”）；
计数++；
});

在递增新表行之前，您需要检查表单元格的长度。达到最大列长度后，重置行并重新开始

max_columns=2；
计数=0；
$（“按钮”）。单击（函数（）{
var content='column'；
if（count==max_columns | |！$（'#maintable tr'）.length）{
$（“#主表”）。追加（“”）；
计数=0；
}
如果（计数！=最大列数）
$（“#maintable tr:last”）.append（“+content+”）；
其他的
$（“#maintable tr:first”）.append（“+content+”）；
计数++；
});

max = 2
$("button").click(function () {
    var content = $('#template').html();
    var $table = $("#maintable");
    var tr = $table.find(">tbody>tr:last");
    if (!tr.length || tr.find(">td").length >= max) {
        // Append a blank row
        tr = $("<tr>");
        $table.append(tr);
    }
    tr.append("<td>hi " + content + "</td>");
});

max_columns = 2;
count=0;
$("button").click(function() {
    var content='column';
    if(count==max_columns||!$('#maintable tr').length){
        $("#maintable").append("<tr>");
        count=0;
    }
    if(count!=max_columns)
        $("#maintable tr:last").append("<td>"+content+"</td>");
    else
        $("#maintable tr:first").append("<td>"+content+"</td>");
    count++;
});