JQuery动态给table添加、删除行 改进版


Posted in Javascript onJanuary 19, 2011
<html> 
<head> 
<title> 
</title> 
<script src="js/jquery-1.4.2_min.js" type="text/javascript"></script> 
<script type="text/javascript" language="javascript"> 
var row_count = 0; 
function addNew() 
{ 
var table1 = $('#table1'); 
var firstTr = table1.find('tbody>tr:first'); 
var row = $("<tr></tr>"); 
var td = $("<td></td>"); 
td.append($("<input type='checkbox' name='count' value='New'><b>CheckBox"+row_count+"</b>") 
); 
row.append(td); 
table1.append(row); 
row_count++; 
} 
function del() 
{ 
var checked = $("input[type='checkbox'][name='count']"); 
$(checked).each(function(){ 
if($(this).attr("checked")==true) //注意:此处判断不能用$(this).attr("checked")==‘true'来判断。 
{ 
$(this).parent().parent().remove(); 
} 
}); 
} 
</script> 
</head> 
<body> 
<input type="button" value="Add" onclick="addNew();"> 
<input type="button" value="Delete" onclick="del();"> 
<div id="rightcontent"> 
<table id="table1" cellspacing="3" cellpadding="3" border="1"> 
<tbody> 
<tr> 
<th> 
Add new row,then test the delete function. 
</th> 
</tr> 
</tbody> 
</table> 
</div> 
</body> 
</html>
Javascript 相关文章推荐
JS控制显示隐藏兼容问题(IE6、IE7、IE8)
Apr 01 Javascript
利用百度地图JSAPI生成h7n9禽流感分布图实现代码
Apr 15 Javascript
JQuery-tableDnD 拖拽的基本使用介绍
Jul 04 Javascript
nw.js实现类似微信的聊天软件
Mar 16 Javascript
Javascript中arguments和arguments.callee的区别浅析
Apr 24 Javascript
Angular2  NgModule 模块详解
Oct 19 Javascript
JS利用正则表达式实现简单的密码强弱判断实例
Jun 16 Javascript
angular2中Http请求原理与用法详解
Jan 11 Javascript
详解VueJS应用中管理用户权限
Feb 02 Javascript
Vuex的各个模块封装的实现
Jun 05 Javascript
vue过滤器实现日期格式化的案例分析
Jul 02 Javascript
vue 获取url参数、get参数返回数组的操作
Nov 12 Javascript
jQuery 1.5最新版本的改进细节分析
Jan 19 #Javascript
基于Jquery与WebMethod投票功能实现代码
Jan 19 #Javascript
jQuery '行 4954 错误: 不支持该属性或方法' 的问题解决方法
Jan 19 #Javascript
Jquery插件 easyUI属性汇总
Jan 19 #Javascript
jquery 圆形旋转图片滚动切换效果
Jan 19 #Javascript
Javascript调用C#代码
Jan 17 #Javascript
js的写法基础分析
Jan 17 #Javascript
You might like
php实现简易聊天室应用代码
2015/09/23 PHP
添加到收藏夹代码(兼容几乎所有的浏览器)
2007/01/09 Javascript
JObj预览一个JS的框架
2008/03/13 Javascript
javascript用户注册提示效果的简单实例
2013/08/17 Javascript
将list转换为json失败的原因
2013/12/17 Javascript
Bootstrap表单组件教程详解
2016/04/26 Javascript
jQuery AJAX timeout 超时问题详解
2016/06/21 Javascript
详解JS中遍历语法的比较
2017/04/07 Javascript
jquery与js实现全选功能的区别
2017/06/11 jQuery
Angular实现的日程表功能【可添加及隐藏显示内容】
2017/12/27 Javascript
解决vuejs项目里css引用背景图片不能显示的问题
2018/09/13 Javascript
jQuery动态操作表单示例【基于table表格】
2018/12/06 jQuery
微信小程序开发注意指南和优化实践(小结)
2019/06/21 Javascript
layui使用templet格式化表格数据的方法
2019/09/16 Javascript
Vue组件间数据传递的方式(3种)
2020/07/13 Javascript
JavaScript实现复选框全选和取消全选
2020/11/20 Javascript
详解Python中列表和元祖的使用方法
2015/04/25 Python
Python循环语句之break与continue的用法
2015/10/14 Python
Python中异常重试的解决方案详解
2017/05/05 Python
Python面向对象编程之继承与多态详解
2018/01/16 Python
python3爬取数据至mysql的方法
2018/06/26 Python
Python递归函数实例讲解
2019/02/27 Python
8种用Python实现线性回归的方法对比详解
2019/07/10 Python
Python shutil模块用法实例分析
2019/10/02 Python
Python实现图像去噪方式(中值去噪和均值去噪)
2019/12/18 Python
Pyorch之numpy与torch之间相互转换方式
2019/12/31 Python
Python基于class()实现面向对象原理详解
2020/03/26 Python
PyQT5 实现快捷键复制表格数据的方法示例
2020/06/19 Python
英国领先的男士服装和时尚零售商:Burton
2017/01/09 全球购物
十佳大学生村官事迹
2014/01/09 职场文书
作风建设演讲稿
2014/05/23 职场文书
建筑学专业自荐书
2014/07/09 职场文书
入股合作协议书
2014/10/12 职场文书
街道务虚会发言材料
2014/10/20 职场文书
小学一年级班主任工作经验交流材料
2015/11/02 职场文书
斗罗大陆八大特殊魂兽,龙族始祖排榜首,第五最残忍(翠魔鸟)
2022/03/18 国漫