jquery 实现简单的表格中增加或删除下一行

下面的代码利用jquery简单的实现表格中增加和删除一行，很简单。

代码如下：

   <div>
        <table>
            <tr><td>1111</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr>
            <tr><td>2222</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr>
            <tr><td>4444</td><td><input type="button" value="添加下一行" /><input type="button" value="删除下一行" /></td></tr>
        </table>
    </div>


 <script type="text/javascript" src="Scripts/jquery-1.4.1.js"></script>
    <script type="text/javascript">
        $(document).ready(function () {
            ModifyClick();
        });

        function ModifyClick() {
            $("table tr input[type='button'] ").each(function () {
                $(this).unbind("click");
                $(this).bind("click", function () {
                    if ($(this).val() == "添加下一行") {
                        $(this).parent().parent().after("<tr><td>Add</td><td><input οnclick=\"ModifyClick()\" type=button value=\"添加下一行\" /><input οnclick=\"ModifyClick()\" type=button value=\"删除下一行\" /></td></tr>");
                    }
                    if ($(this).val() == "删除下一行") {
                        $(this).parent().parent().next().eq(0).remove();
                    }
                });
            });
         }
    </script>

        

转载于:https://www.cnblogs.com/chenping-987123/archive/2010/07/29/1787988.html