0

我对 jquery 很陌生，我想通过单击添加或删除图像来添加和删除表行。

添加按钮完美运行，手动添加的行与删除按钮完美运行，但如果我添加一个新行，然后单击新行的删除按钮，它什么也不做。

我试过搜索谷歌并测试所有答案，但似乎没有一个对我有用。

    <script type="text/javascript">
            $(document).ready(function(){
                    var idCount = 0;
                    idCount++;
                    var new_row="<tr><td><span style='float:left; margin-left:20px;'>IP:&nbsp;</span><input name='ipaddr' type='text' /></td><td><img src='images/delete.png' width='20px' height='20px' id='deleteRow' /></td></tr>";
                    $("table#ipList img#addRow").click(function() {
                            $("table#ipList").append(new_row);
                    });
                    $("table#ipList img#deleteRow").click(function() {
                            //$("img#deleteRow").parents("tr").remove();
                            //$("img#deleteRow").parent().parent().last().remove();
                            $("img#deleteRow").last().parent().parent().remove();
                    });
            });
    </script>
    </head>
    <body>
    <table id="ipList">
            <tr>
                    <td><span style="float:left; margin-left:20px;">IP:&nbsp;</span><input name="ipaddr" type="text" /></td>
                    <td><img src="images/add.png" width="20px" height="20px" id="addRow" /></td>
            </tr>
            <tr>
                    <td><span style="float:left; margin-left:20px;">IP:&nbsp;</span><input name="ipaddr" type="text" /></td>
                    <td><img src="images/delete.png" width="20px" height="20px" id="deleteRow" /></td>
            </tr>
    </table>
4

2 回答 2

4

以这种方式使用委托：

但是 ID 在上下文页面上必须是唯一的！

 $(document).ready(function () {
     var idCount = 0;
     idCount++;
     $("#ipList").on('click', "#addRow", function () {
         $("#ipList").append(new_row);
     });
     $("#ipList").on('click', "#deleteRow", function () {
         $("#deleteRow").closest('tr').remove();
     });
  });
于 2013-07-31T13:45:02.343 回答
1

您将需要事件委托。为此使用 on() 方法。http://api.jquery.com/on/

于 2013-07-31T13:44:34.637 回答