JQuery实现动态表格点击按钮表格增加一行


Posted in Javascript onAugust 24, 2014

功能实现:点击添加按钮,表格增加一行并给其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 {

}
};
Javascript 相关文章推荐
jquery简单体验
Jan 10 Javascript
输入自动提示搜索提示功能的javascript:sugggestion.js
Sep 02 Javascript
jQuery中insertBefore()方法用法实例
Jan 08 Javascript
jQuery实现高亮显示的方法
Mar 10 Javascript
使用jQuery在对象中缓存选择器的简单方法
Jun 30 Javascript
JS获取复选框的值,并传递到后台的实现方法
May 30 Javascript
vue全局组件与局部组件使用方法详解
Mar 29 Javascript
JS实现获取当前所在周的周六、周日示例分析
May 11 Javascript
简单了解JavaScript中的执行上下文和堆栈
Jun 24 Javascript
antd日期选择器禁止选择当天之前的时间操作
Oct 29 Javascript
vue中watch的用法汇总
Dec 28 Vue.js
Node与Python 双向通信的实现代码
Jul 16 Javascript
js重写alert控件(适合学习js的新手朋友)
Aug 24 #Javascript
控制台报错object is not a function的解决方法
Aug 24 #Javascript
Jquery仿IGoogle实现可拖动窗口示例代码
Aug 22 #Javascript
JavaScript验证电子邮箱的函数
Aug 22 #Javascript
jQuery实现列表自动滚动循环滚动展示新闻
Aug 22 #Javascript
用jquery修复在iframe下的页面锚点失效问题
Aug 22 #Javascript
JavaScript实现的石头剪刀布游戏源码分享
Aug 22 #Javascript
You might like
Wordpress php 分页代码
2009/10/21 PHP
PHP Error与Logging函数的深入理解
2013/06/03 PHP
PHP实现的随机IP函数【国内IP段】
2016/07/20 PHP
PHP实现数组根据某个字段进行水平合并,横向合并案例分析
2019/10/08 PHP
php中数组最简单的使用方法
2020/12/27 PHP
jQuery EasyUI API 中文文档 - ValidateBox验证框
2011/10/06 Javascript
调试Javascript代码(浏览器F12及VS中debugger关键字)
2013/01/25 Javascript
Jquery模仿Baidu、Google搜索时自动补充搜索结果提示
2013/12/26 Javascript
js实现n秒倒计时后才可以点击的效果
2015/12/20 Javascript
如何从零开始利用js手写一个Promise库详解
2018/04/19 Javascript
新手快速入门JavaScript装饰者模式与AOP
2019/06/24 Javascript
在Layui中操作数据表格,给指定单元格添加事件示例
2019/10/26 Javascript
vue项目引入ts步骤(小结)
2019/10/31 Javascript
小程序表单认证布局及验证详解
2020/06/19 Javascript
python基于urllib实现按照百度音乐分类下载mp3的方法
2015/05/25 Python
Python聚类算法之凝聚层次聚类实例分析
2015/11/20 Python
Python随机生成带特殊字符的密码
2016/03/02 Python
Linux中安装Python的交互式解释器IPython的教程
2016/06/13 Python
利用Opencv中Houghline方法实现直线检测
2018/02/11 Python
python对excel文档去重及求和的实例
2018/04/18 Python
python虚拟环境的安装和配置(virtualenv,virtualenvwrapper)
2019/08/09 Python
Python使用pickle进行序列化和反序列化的示例代码
2020/09/22 Python
python不同版本的_new_不同点总结
2020/12/09 Python
canvas绘图按照contain或者cover方式适配并居中显示
2019/02/18 HTML / CSS
ZINVO手表官网:男士和女士手表
2019/03/10 全球购物
一套Java笔试题
2016/08/20 面试题
万户网络JAVA程序员岗位招聘笔试试卷
2013/01/08 面试题
opencv实现图像几何变换
2021/03/24 Python
争论的故事教学反思
2014/02/06 职场文书
授权委托书范本
2014/04/03 职场文书
授权委托书(完整版)
2014/09/10 职场文书
机械设计专业大学生职业生涯规划书范文
2014/09/13 职场文书
2014最新毕业证代领委托书
2014/09/26 职场文书
2015年网络管理员工作总结
2015/05/21 职场文书
如何解决.cuda()加载用时很长的问题
2021/05/24 Python
深入理解go slice结构
2021/09/15 Golang