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下操作HTML控件的实现代码
Jan 12 Javascript
Extjs中ComboBox加载并赋初值的实现方法
Mar 22 Javascript
canvas实现手机端用来上传用户头像的代码
Oct 20 Javascript
根据输入邮箱号跳转到相应登录地址的解决方法
Dec 13 Javascript
bootstrap fileinput 上传插件的基础使用
Feb 17 Javascript
vue双花括号的使用方法 附练习题
Nov 07 Javascript
axios取消请求的实践记录分享
Sep 26 Javascript
jquery多级树形下拉菜单的实例代码
Jul 09 jQuery
解决Vue在Tomcat8下部署页面不加载的问题
Nov 12 Javascript
解决vue刷新页面以后丢失store的数据问题
Aug 11 Javascript
JavaScript经典案例之简易计算器
Aug 24 Javascript
AJAX检测用户名是否存在的方法
Mar 24 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
收音机指标测试方法及仪器
2021/03/01 无线电
Drupal简体中文语言包安装教程
2014/09/27 PHP
php基于str_pad实现卡号不足位数自动补0的方法
2014/11/12 PHP
如何利用预加载优化Laravel Model查询详解
2017/08/11 PHP
php实现姓名根据首字母排序的类与方法(实例代码)
2018/05/16 PHP
Laravel中错误与异常处理的用法示例
2018/09/16 PHP
聊聊 PHP 8 新特性 Attributes
2020/08/19 PHP
js Dialog 实践分享
2012/10/22 Javascript
JQuery中form验证出错信息的查看方法
2013/10/08 Javascript
详解JavaScript语法对{}处理的坑爹之处
2014/06/05 Javascript
使用js实现数据格式化
2014/12/03 Javascript
javascript实现 百度翻译 可折叠的分享按钮列表
2015/03/12 Javascript
javascript实现动态导入js与css等静态资源文件的方法
2015/07/25 Javascript
任意Json转成无序列表的方法示例
2016/12/09 Javascript
微信小程序如何播放腾讯视频的实现
2019/09/20 Javascript
[01:19:35]DOTA2上海特级锦标赛主赛事日 - 3 败者组第三轮#2Fnatic VS OG第二局
2016/03/05 DOTA
利用Python脚本在Nginx和uwsgi上部署MoinMoin的教程
2015/05/05 Python
Pycharm学习教程(6) Pycharm作为Vim编辑器使用
2017/05/03 Python
python数据类型_元组、字典常用操作方法(介绍)
2017/05/30 Python
基于腾讯云服务器部署微信小程序后台服务(Python+Django)
2019/05/08 Python
Python 运行.py文件和交互式运行代码的区别详解
2019/07/02 Python
Python多进程编程multiprocessing代码实例
2020/03/12 Python
keras 读取多标签图像数据方式
2020/06/12 Python
python爬虫爬取图片的简单代码
2021/01/18 Python
LightInTheBox西班牙站点:全球商品在线采购
2016/09/22 全球购物
Rockport乐步美国官网:风靡美国的白宫鞋
2016/11/24 全球购物
波兰品牌内衣及泳装网上商店:Astratex.pl
2017/02/03 全球购物
Allsole美国/加拿大:英国一家专门出售品牌鞋子的网站
2018/10/21 全球购物
Hotels.com英国:全球领先的酒店住宿提供商
2019/01/24 全球购物
接口的多继承会带来哪些问题
2015/08/17 面试题
岗位职责的定义
2013/11/10 职场文书
回门宴父母答谢词
2014/01/26 职场文书
基层党员群众路线整改措施及努力方向
2014/10/28 职场文书
企业党支部工作总结2015
2015/05/21 职场文书
法人代表证明书范本
2015/06/18 职场文书
学习党史心得体会2016
2016/01/23 职场文书