/** * 动态添加删除表格行 */ $("document").ready(function(){ //表格的删除按钮事件绑定 $("#TbData #del").click(function() { $(this).parents(".repeat").remove(); }); //第六个表格的添加按钮事件绑定 $("#add").click(function(){ $("#tbbody>.template") //连同事件一起复制 .clone(true) //去除模板标记 .removeClass("template") //修改内部元素 //.find(".content") //.text("新增行") //.end() //.find(".del") //.text("删除") //.end() //插入表格 .appendTo($("#tbbody")) }); } )
表格如下:
<table id="TbData" width="100%"> <tbody id="tbbody"> <tr> <th>公司名称</th> <th>联系人</th> <th></th> </tr> <tr class="template repeat"> <td> <input type="text" id="company" class="company" name="company[]"></td> <td><input type="text" id="linkman" class="linkman" name="linkman[]"></td> <td><a href="#" id="del"> <img id="del" src="http://images.cnblogs.com/delete.gif"> </a> </td> </tr> </tbody> </table>