JQuery删除动态表上的行答案

【问题标题】：JQuery Delete Row on dynamic tablesJQuery删除动态表上的行
【发布时间】：2017-09-11 15:11:22
【问题描述】：

我正在创建一个注册页面，用户可以在其中注册其他几个人。我已经做到了，只有当用户选择某个选项时，表格才会显示。我还添加了添加按钮，添加行非常好。问题是当我为删除按钮添加功能时，一切都会中断。这是我的html：

<div id="add_table" style="display:none;" >
    <button type="button" id="AddLine">Add Line</button>
    <table border="1px" id="table">
        <tr>
            <td>First Name</td>
            <td>Last Name</td>
            <td>Phone</td>
            <td>Email</td>
            <td>Ethnicity</td>
        </tr>
        <tr>
            <td><input type=text /></td>
            <td><input type=text /></td>
            <td><input type=text /></td>
            <td><input type=text /></td>
            <td><input type=text /></td>
            <td><button type="button">delete</button></td>
        </tr>
    </table>
</div>

这是我的 jquery 代码：

$(document).ready(function(e) { 
    $("input[name= 'Reg_num_r']").change( function () {
        if($(this).val()==1) {
            $("#add_table").hide();
        } else {
            $("#add_table").show();
        }
    });

    /*$("#table").on("click", "button", function() {
       $(this).closest("tr").remove(); 
    });*/

    $("#AddLine").click(function () {
        var row = "<tr><td><input type=text /></td><td><input type=text /></td><td><input type=text /></td><td>                   <input type=text /></td><td><input type=text /></td><td><button type=button>delete</button></td></tr>";
        $("#table").append(row);
    });
});

现在，当我取消注释上面的注释代码时，一切都停止了。即使用户选择了正确的选项，表格也不会显示。我应该如何修复它才能正确执行删除行操作？

【问题讨论】：

嗯，我没有看到问题here。您使用的是什么版本的 jQuery？ on 在 1.7 中引入。
这太奇怪了……注释代码似乎没问题。您使用的是哪个版本的 jQuery？您是否记得删除评论的开头/* 和结尾*/？
您的控制台是否出现任何错误
@AndrewWhitaker 是的，我知道，我尝试了同样的事情，这就是我在这里发帖的原因。我很困惑，它是如何在小提琴而不是实用性中工作的。
@aziz.punjani 我如何检查控制台。是用 firefox 和 firebug 吗？

标签： jquery html html-table dynamic-tables

【解决方案1】：

Ctrl+CCtrl+V 来自您的代码：

/*$("#table").on("click", "button", function() {
    $(this).closest("tr").remove(); 
});*/

最后一个分号后面有一个 0 宽的空格，点击编辑并使用箭头键查看。它是 JavaScript 中的非法字符，会产生语法错误。

这是从 jsFiddle 和其他地方复制代码时的常见问题。

我建议手头有一份Notepad++ 的副本来查看copypasta 代码，它默认将那些不可见的字符显示为?：

您也可以取消注释代码并在JSHint 中测试它，它会告诉您在哪一行有无效字符。

【讨论】：