问题描述
- 实现点击 图标动态增加一行或多行，删除一行或多行
<td colspan =""4""><input class=""w100"" id=""meetingdate1"" name=""meetingdate"" type=""text"" validateGroup=""{date:true}"" /><img src=""<c:url value=""/resources/images/calendar.gif""/>"" /> </td>这是一行文本框 点击后面的图片 实现动态增加一行或多行 删除一行或多行 各位大神帮帮忙用 jQuery怎么实现呀 代码怎么写呀
解决方案
<!DOCTYPE html><html><head><script src=""/jquery/jquery-1.11.1.min.js""></script><script>function del(self){ $(self).parents('tr').remove();}function add(self){ var tr = '<tr>' + '<td colspan =""4"">'+ '<input class=""w100"" id=""meetingdate1"" name=""meetingdate"" type=""text"" />'+ '<img src="" "" alt=""删除"" onclick=""del(this)""/>'+ '<img src="" "" alt=""增加"" onclick=""add(this)""/></td>'+'</tr>'; $(self).parents('table').append(tr);}</script></head><body><table id='mytable'><tr><td colspan =""4""><input class=""w100"" id=""meetingdate1"" name=""meetingdate"" type=""text"" /><img src="" "" alt='删除' onclick='del(this)'/><img src="" "" alt='增加' onclick='add(this)'/></td></tr></table></body></html>解决方案二：
function addtr() {
var s = """";
var num = $(""#num"").val();
num++;
$(""#num"").val(num);
//alert(num);
var des = ""
"";
des += "" "";
des += "" "";
des += """";
des += "" "";
des += "" "";
des += """";
des += "" "";
des += "" "";
des += """";
des += "" "";
des += "" "";
des += """";
des += "" "";
des += "" "";
des += """";
des += "" "";
des += "" "";
des += """";
des += "" "";
des += "" 删除"";
des += """";
des += """";
$(""#table"").append(des);
}
function del(id) {
$(""#tr"" + id).remove();
//var num = $(""#num"").val();
//num--;
//$(""#num"").val(num);
//alert(num);
}
之前写过的一个。 可以按照自己需要的样式拼接
解决方案三：
这样的例子很多，参考：
http://blog.csdn.net/zhentmc/article/details/7643148
解决方案四：
http://ask.csdn.net/questions/195913#answer_form
解决方案五：
javascript添加删除表格数据行示例
解决方案六：
<!DOCTYPE html>
function del(self){ $(self).parents('tr').remove();}function add(self){ var tr = '<tr>' + '<td colspan =""4"">'+ '<input class=""w100"" id=""meetingdate1"" name=""meetingdate"" type=""text"" />'+ '<img src="" "" alt=""删除"" onclick=""del(this)""/>'+ '<img src="" "" alt=""增加"" onclick=""add(this)""/></td>'+'</tr>'; $(self).parents('table').append(tr);}
解决方案七：
ORACLE实现多行合并一行
多行合并为一行