Question

我有生成表格的代码。您可以在下面看到代码：

function createDynamicTable(tbody, rows, cols) {
         if (tbody == null || tbody.length < 1) return;
         for (var r = 1; r <= rows; r++) {
             var trow = $("<tr>");
             for (var c = 1; c <= cols; c++) {
                 var cellText = "Cell " + r + "." + c
                 $("<td>")
                         .addClass("tableCell")
                         .text(cellText)
                         .data("col", c)
                         .appendTo(trow);
             }
             trow.appendTo(tbody);
         }
     }

结果是：

<table id="tbl" border="1">
<tbody>
<tr>
<td class="tableCell">Cell 1.1</td>
<td class="tableCell">Cell 1.2</td>
<td class="tableCell">Cell 1.3</td>
<td class="tableCell">Cell 1.4</td>
</tr>
</tbody>
</table>

我希望添加每个<td></td> =＆gt; <td><input><input/></td>塔加斯。我怎么能这样做？

Answer 1

稍微修改一下你的函数，它会为每个单元格添加input个字段：

function createDynamicTable(tbody, rows, cols) {
    if (tbody == null || tbody.length < 1) return;
    for (var r = 1; r <= rows; r++) {
        var trow = $("<tr>");
        for (var c = 1; c <= cols; c++) {
            var input = $("<input />");
            $("<td>").addClass("tableCell")
                .append(input)
                .data("col", c)
                .appendTo(trow);
        }
        trow.appendTo(tbody);
    }
}

DEMO： http://jsfiddle.net/Xt33h/

Answer 2

你可以这样做：

$('#tbl td:last').after('<td><input><input/></td>');

Answer 3

将for（生成单元格的位置）更改为

for (var c = 1; c <= cols; c++) {
    var cellText = "Cell " + r + "." + c
    var td = $("<td>")
        .addClass("tableCell")
        .text(cellText)
        .data("col", c)
        .appendTo(trow);

    $('<input />').appendTo(td);
}

如何在td标签中插入输入标签？

3 个答案: