Question

我的按钮和表格如图所示

<button type="button" class="btn btn-md" id="addRowBtn">Test Button To Add Row</button>
<table id="tableForRows">
     <tr>
        <td>

        </td>
    </tr>
</table>

我想继续点击按钮添加文本框。我的jquery如图所示，

$(document).ready(function () {
    $("#addRowBtn").on("click", function () {
        var tableRow = $("#tableForRows").html();
        var itemToAdd = "<tr><td><input type="text"/></td></tr>";
       $("#tableForRows").append(itemToAdd);
    });
});

请帮助我知道正确的方法。提前谢谢..

Answer 1

您有引用问题，请使用"1"的单引号：

type='text'

此外，根据您分享的内容，"<tr><td><input type='text'/></td></tr>";是多余的。

Answer 2

$(document).ready(function () {
    $("#addRowBtn").click(function () {
        var tr = document.createElement("tr");
        var td = document.createElement("td");
        var input = document.createElement("input");
        input.type = "text";
        $("#tableForRows").append(tr);
        $("#tableForRows tr:last-child").append(td);
        $("#tableForRows tr:last-child td:last-child").append(input);
    });
});

JSfiddle：https://jsfiddle.net/Neoares/Lo6p02oc/

使用jquery向表添加行

2 个答案: