制作动态表格的主要是运用js中表格类的insertRow、insertCell简易添加行和列的代码,不过要注意每行添加的表格是有位置行编号的,
每行的编号为rows.length-1,增加的表格内的标签属性内容注意把原来的双引号变为单引号: <script language="javascript" type="text/javascript">
var id = 5;
function addtr(){ //增加表格
var tem = ++id;
var t = document.getElementById("tab");
var row = t.insertRow(t.rows.length-1);
row.bgColor="#CCCCCC";
row.id="row"+tem;
var cell1 = row.insertCell(0);
cell1.bgColor="#DFF1F8";
var cell2 = row.insertCell(1);
cell2.bgColor="#f0f0f0";
var cell3 = row.insertCell(2);
cell3.bgColor="#DFF1F8";
var cell4 = row.insertCell(3);
cell4.bgColor="#f0f0f0";
cell1.innerHTML="产品编号:";
cell2.innerHTML="<input type='text' name='code"+tem+"' id='code"+tem+"' onchange='prodcheck(this.id)'/>";
cell3.innerHTML="数 量:";
cell4.innerHTML="<input type='text' name='num"+tem+"' id='num"+tem+"' onchange='isNumber(this.id)' />&nbsp;&nbsp;&nbsp;&nbsp;<a href='javascript:deltr()'>删除</a>";
document.f.hid.value=id;
} function deltr(){ //删除表格
var tdel = document.getElementById("tab");
tdel.deleteRow(id+2);
id--;
document.f.hid.value=id;
}
</script>、 在删除表格时,注意每行id属性的变化,需要改变id值。

5.11-5.15javascript制作动态表格的更多相关文章

  1. vue:使用element-ui制作动态表格

    参考; https://github.com/PanJiaChen/vue-element-admin/blob/master/src/views/table/dynamic-table/compon ...

  2. ppt制作动态表格与文字

          在工作中经常与ppt打交道的小伙伴们,是不是非常想让自己做的ppt图表能够动起来,显得高大上一点呢?比如让柱形图慢慢长起来,让折线图慢慢画出来,让文字像字幕一样缓缓上升?本文将给大家整理几 ...

  3. Xcode 6制作动态及静态Framework

    技术交流新QQ群:414971585 有没有写SDK或者要将一些常用的工具类做成Framework的经历? 你或许自己写脚本完成了这项工作,相信也有很多的人使用 iOS-Universal-Frame ...

  4. Xcode 6制作动态及静态Framework和各种坑

    Xcode 6制作动态及静态Framework http://www.cocoachina.com/ios/20141126/10322.html 有没有写SDK或者要将一些常用的工具类做成Frame ...

  5. 【转】Xcode 6制作动态及静态Framework

    http://years.im/Home/Article/detail/id/52.html 创建iOS动态库 新建工程并选择默认Target为Cocoa Touch Framework, 如图: 做 ...

  6. jQuery动态表格插件 AppendGrid

    AppendGrid是一个jQuery动态表格插件,提供像填写电子表格数据一样在页面去输入结构化数据. 它允许用户在表格里增加/删除/插入/删除行,控制input/select/textarea 提交 ...

  7. 查询表格——建立动态表格,使用ajax输入查询条件将后台数据查询出来以表格的形式展示出来

    建立动态表格,使用ajax将前台查询条件传给后台,并将查询结果以表格的形式展示出来. 页面的展示效果如下图所示: 第一步:查询条件的部分: 代码如下: <div class="text ...

  8. JavaScript实现动态表格

    运行效果: 源代码: 1 <!DOCTYPE html> 2 <html lang="zh"> 3 <head> 4 <meta char ...

  9. 使用CSS把ul,li制作成表格

    查看效果:http://hovertree.com/texiao/css/7.htm 具体实现请看样式部分. 完整代码: <!DOCTYPE html> <html> < ...

随机推荐

  1. Tomcat中解决sql server连接失败--- java.lang.ClassNotFoundException: com.microsoft.jdbc.sqlserver.SQLServerDriver

    php连接mysql数据库很容易,他俩真是黄金搭档.最近转战java连接微软sqlServer,步骤稍微复杂一点,但也不是太难,中途遇到了一点小问题,最后在csdn论坛里找到了答案http://bbs ...

  2. 重装系统分区时,发现一个叫LVM的东西,找出来和大家分享

    LVM是 Logical Volume Manager(逻辑卷管理)的简写,它是Linux环境下对磁盘分区进行管理的一种机制,它由Heinz Mauelshagen在Linux 2.4内核上实现,目前 ...

  3. 使用apache-jMeter出现乱码问题。

    服务器字符(utf-8)正常,但是在使用apache-jMeter的时候,得到的数据会乱码.所以我们需要设置jmeter的字符编码.默认为ISO-8859-1. 进入jmeter.bat文件夹,有个j ...

  4. Python2和Python3在windows下共存

    Python2.7 和 Python3不兼容,两种环境可能都会用到.ubuntu14.04中已经默认安装了这两个版本,在shell中输入python会自动进入Python2.7的交互环境,输入Pyth ...

  5. 借助 MySQLTuner 优化 MySQL 性能(转载的一篇文章)

    MySQLTuner 是一个 Perl 脚本,可以用来分析您的 MySQL 性能,并且基于收集到的信息给出相应的优化建议.这样子,您就可以调整 my.cnf 从而优化您的 MySQL 设置. 这边只是 ...

  6. delphi 10 seattle 中 解决IOS 9 限制使用HTTP 服务问题

    IOS 9 于17号早上正式开始推送,早上起来立马安装,这次升级包只有1G, 安装空间也大大降低(想起IOS 8 升级时,几乎把手机里面的东西删光了,满眼都是泪). 虽然安装后,网上几乎是铺天盖地的吐 ...

  7. LR工具使用之场景设置

    LR工具使用之场景设置 一.操作步骤 1.运行loadrunner,进入运行负载测试控件:

  8. H5测试区别与PC端测试关注点

    除了基本的业务逻辑功能测试之后,H5页面的测试,需要关注以下几点: 1.  通过H5网页(非手机的返回功能)的返回功能可以返回,不会出现无法返回的情况. 2.  横屏竖屏相互切换,能自适应,并且布局不 ...

  9. bash脚本编程之一 变量、变量类型等

    变量的内容 1.变量命名:            1.只能包含字母.数字和下划线,并且不能以数字开头,    2.不应该跟系统中已有的环境变量重名    3.最好能见名知意 2.变量赋值: 设置变量: ...

  10. SQL Server 2008中删除errorlog文件的方法

    删除error咯个文件[SSQL\MSSQL10.MSSQLSERVER\MSSQL\Log目录下面] 由于默认情况下,SQL Server 保存 7 个 ErrorLog 文件,名为: ErrorL ...