<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>动态操作表格</title> <script type="text/javascript" src="table/jquery.js" language="javascript"></script> <script type="text/javascript"> var count=0; function add(){ var name=$("#name").val(); var card=$("#card").val(); var sex=$("#sex").val(); //判断只能添加二十个 if(count==20){ alert("不能再加了"); }else{ count++; //追加 $("table").append("<tr id="+count+"><td>"+name+"</td>"+ "<td>"+card+"</td>"+"<td>"+sex+"</td>"+"<td> <a href='javascript:del ("+count+")'>删除</a></td></tr>"); } } //删除 function del(row){ count--; $("#"+row).remove(); } </script> <style type="text/css"> table { border: 1px solid #00C; border-collapse: collapse; width: 600px; text-align: center; } table tr td { border: 1px solid #00C; border-collapse: collapse; width: 600px; } </style> </head> <body> 名字 <input type="text" id="name" /> 学号 <input type="text" id="card" /> 性别 <input type="text" id="sex" /> <input type="button" onclick="add()" value="添加" /> <p></p> <table> <tr> <th>姓名</th> <th>学号</th> <th>性别</th> <th>操作</th> </tr> </table> </body> </html>
相关推荐
jQuery表格添加行数据代码是一款可以在行内添加编辑删除的表格代码。
主要介绍了jQuery+ajax实现动态添加表格tr td功能,结合实例形式分析了jQuery基于ajax动态创建页面table元素相关操作技巧,需要的朋友可以参考下
jQuery 动态添加或删除表格行特效,每点击一次添加,会添加一个表格单元格,点击删除会删掉所有行,基于jQuery插件完成,想研究的朋友下载一看。
jquery表格动态添加删除行代码是一款基于jquery实现的表格里面点击按钮后可进行自动添加删除行功能代码。
74、jquery表格动态添加删除行代码
raydreams.js是一款基于Bootstrap的jquery动态数据表格插件。该jquery动态数据表格的特点是使用简单,它能通过json动态加载表格所需的数据,并通过配置参数设置表格列是否排序和添加功能按钮等。
主要介绍了JQuery动态添加和删除表格行的方法,实例分析了jQuery中动态操作表格行的技巧,具有一定参考借鉴价值,需要的朋友可以参考下
jquery表格添加删除行点击按钮动态添加删除行
主要介绍了jQuery实现动态添加、删除按钮及input输入框的方法,涉及jQuery事件响应及页面元素动态操作相关实现技巧,需要的朋友可以参考下
JQuery_可拖曳动态添加表格、动态排序
动态表格,功能为点击添加按钮,表格增加一行并给其name属性赋予的值,点击删除,自动删除这一行,具体实现如下
jquery实现动态添加文本框和下拉框效果。
使用jQuery实现动态添加、删除表格,向后台提交时更方便。
使用jquery为表格动态添加行数据,以及删除某一行数据
jquery脚本实现动态添加列,删除指定列
内容索引:脚本资源,jQuery,动态删除 jQuery 动态添加或删除表格行特效,每点击一次添加,会添加一个表格单元格,点击删除会删掉所有行,基于jQuery插件完成,想研究的朋友下载一看。
使用jQuery为表格添加合计行,方法依赖jQuery,方法中使用到的JQ是jQuery中的$方法的别名