首页 > 网络编程 > JavaScript > 表单特效 > js动态添加表格行 js在不刷新的情况下动态添加表格行[脚本之家强烈推荐] 2008-10-14 00:07:28 作者： 这个功能一般用于，一些添加一些不确定的信息，由用户自己添加，以前都是如果你添加了2个突然发现不够，再点添加，就会发现原来的内容被替换了，下面的代码就不会，比较不错 <!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=gb2312" /> <title>动态添加表格行</title> </head> <body> <style type="text/css"> <!-- td{width:300px;text-align:center;margin:0px;padding:0px} --> </style> <script language="javascript" type="text/javascript"> <!-- function show(){ var num=document.getElementById("test").getElementsByTagName("input")[0].value; var y=parseInt(num); for(var i=0;i<y;i++){ var strS='<table cellpadding="0" cellspacing="0" border="1px solid black"><tr><td><select style="width:102px"><option>选择产品编号</option></select></td><td><input type="text" style="width:99px" /></td><td><input type="text" style="width:100px" />(数字)</td><td><input type="text" style="width:100px" /></td></tr></table>'; document.getElementById("change").innerHTML+=strS; } } //--> </script> <div id="test"> 添加产品品种数:<input type="text" name="text" value="" /> <input type="button" name="submit" value="生成输入框" onclick="show()" /> </div> <table cellpadding="0" cellspacing="0" border="1px solid #ccc"> <tr style="background-color:#009999"> <td>产品编号</td> <td>产品名称</td> <td>数量</td> <td>单价</td> </tr> </table> <div id="change"> </div> </body> </html> [Ctrl+A 全选 注:如需引入外部Js需刷新才能执行] 您可能感兴趣的文章:js下为表格内部动态添加行的代码javascript动态添加表格数据行(ASP后台数据库保存例子)javascript 动态添加表格行js生成动态表格并为每个单元格添加单击事件的方法动态添加删除表格行的js实现代码javascript如何动态加载表格与动态添加表格行js动态添加表格数据使用insertRow和insertCell实现javascript动态向网页中添加表格实现代码原生JS操作网页给p元素添加onclick事件及表格隔行变色简单的js表格操作
