JQuery动态表格
功能实现:点击添加按钮,表格增加一行并给其name属性赋予的值,方便获取
点击删除,自动删除这一行
JQuery中定义一个count变量
var count = 1;
function add() {
var tbl = document.all.ci;
var rows = tbl.rows.length;
var tr = tbl.insertRow(rows); var e_id = tr.insertCell(0);
e_id.innerHTML = '<input type="text" name="e_id' + count + '" size="7" />'; var class_id = tr.insertCell(1);
class_id.innerHTML = ''; var memo = tr.insertCell(2);
memo.innerHTML = '<input type="text" name="memo' + count + '" size="14" />'; var del = tr.insertCell(3);
del.innerHTML = '<input type="button" onclick="del(this)" value="删除" />';
count++;
} function del(btn) {
var tr = btn.parentElement.parentElement;
var tbl = tr.parentElement;
if (tr.rowIndex >= 1) {
tbl.deleteRow(tr.rowIndex);
} else { }
};
JQuery动态表格的更多相关文章
- jQuery动态表格插件 AppendGrid
AppendGrid是一个jQuery动态表格插件,提供像填写电子表格数据一样在页面去输入结构化数据. 它允许用户在表格里增加/删除/插入/删除行,控制input/select/textarea 提交 ...
- jquery动态表格,动态添加表格行
转载收藏于:https://www.cnblogs.com/zhangqs008/archive/2013/05/09/3618459.html 效果图: Html:<html> &l ...
- jQuery动态增删改查表格信息,可左键/右键提示
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- jquery 动态添加表格行
jquery 动态添加表格行 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <h ...
- jQuery动态对表格Table进行添加或删除行以及修改列值操作
jQuery,不仅可以以少量的代码做很多操作,而且兼容性好(各种浏览器,各种版本). 下面用jQuery动态对表格Table进行添加或删除行以及修改列值操作 1.jQuery代码 <script ...
- jQuery——动态给表格添加序号
摘录自:http://www.cnblogs.com/picaso/archive/2012/10/08/2715564.html 很多时候遇到需要对表格动态操作,而且一般都会有表格的序号,但是有时候 ...
- jQuery实现表格行的动态增加与删除(改进版)
之前写过一个简单的利用jQuery实现表格行的动态增加与删除的例子,有些人评论说"如果表格中是input元素,那么删除后的东西都将自动替换,这样应该是有问题的,建议楼主改进!",故 ...
- jQuery的下面是动态表格动态表单中的HTML代码
动态表格动态表单中的Jquery代码 <script type="text/javascript" src="/include/jquery/jquery-1.1. ...
- 第84天:jQuery动态创建表格
jQuery动态创建表格 <!DOCTYPE html> <html lang="en"> <head> <meta charset=&q ...
随机推荐
- for循环执行顺序
for循环的执行顺序用如下表达式: for(expression1;expression2;expression3) { expression4; } 执行的顺序应该是: 1)第一次循环,即初始化循环 ...
- 【solr基础教程之九】客户端
一.Java Script 1.由于Solr本身可以返回Json格式的结果,而JavaScript对于处理Json数据具有天然的优势,因此使用JavaScript实现Solr客户端是一个很好的选择. ...
- DOM2定位与高宽类属性专题学习【DOM专题学习系列(一)】
网页可见区域宽: document.body.clientWidth;网页可见区域高: document.body.clientHeight;网页可见区域宽: document.body.offset ...
- 凸包(hd1392)
Surround the Trees Time Limit: 2000/1000 MS (Java/Others) Memory Limit: 65536/32768 K (Java/Other ...
- C# 委托2
委托的定义: (1) 将方法作为变量使用的一种机制,就是将方法当作变量用(声明,赋值,传参) (2) 将变量当作方法来用,首先就要去声明变量,就要考虑变量的类型,就是(委托变量,对应方法的返回值, ...
- mybatis第一个入门demo
学习框架技术,一般先写个demo,先知道是什么,然后在知道为什么,这也是进步的一种. 源码链接:http://pan.baidu.com/s/1eQJ2wLG
- python爬虫系列之爬京东手机数据
python抓京东手机数据 作者:vpoet mail:vpoet_sir@163.com #coding=utf-8 import urllib2 from lxml import etree im ...
- Multiple outputs from T4 made easy – revisited » DamienG
Multiple outputs from T4 made easy – revisited » DamienG Multiple outputs from T4 made easy – revisi ...
- JDBC官方用法
JDBC官方用法https://bitbucket.org/xerial/sqlite-jdbc/#markdown-header-usage 代码下载https://github.com/xeria ...
- Linux开机禁用开启防火墙
1.# chkconfig --list:显示开机可以自动启动的服务 结果:iptables 0:off 1:off 2:on 3:on 4:on 5:on ...