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 相关文章推荐
dess中一个简单的多路委托的实现
Jul 20 Javascript
eval的两组性能测试数据
Aug 17 Javascript
jQuery选择器简明总结(含用法实例,一目了然)
Apr 25 Javascript
JQuery设置获取下拉菜单某个选项的值(比较全)
Aug 05 Javascript
微信小程序 教程之模块化
Oct 17 Javascript
微信小程序 picker-view 组件详解及简单实例
Jan 10 Javascript
Canvas实现放射线动画效果
Feb 15 Javascript
node.js学习之事件模块Events的使用示例
Sep 28 Javascript
Node.js利用断言模块assert进行单元测试的方法
Sep 28 Javascript
JS使用百度地图API自动获取地址和经纬度操作示例
Apr 16 Javascript
Vue3.0中的monorepo管理模式的实现
Oct 14 Javascript
Vue路由对象属性 .meta $route.matched详解
Nov 04 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函数getenv简介和使用实例
2014/05/12 PHP
php中使用PHPExcel读写excel(xls)文件的方法
2014/09/15 PHP
jquery.cookie() 方法的使用(读取、写入、删除)
2013/12/05 Javascript
js获取select选中的option的text示例代码
2013/12/19 Javascript
调用innerHTML之后onclick失效问题的解决方法
2014/01/28 Javascript
js实现身份证号码验证的简单实例
2014/02/19 Javascript
使用CSS3的scale实现网页整体缩放
2014/03/18 Javascript
JavaScript实现关键字高亮功能
2014/11/12 Javascript
以jQuery中$.Deferred对象为例讲解promise对象是如何处理异步问题
2015/11/13 Javascript
JQUERY表单暂存功能插件分享
2016/02/23 Javascript
jQuery封装的屏幕居中提示信息代码
2016/06/08 Javascript
AngularJs bootstrap详解及示例代码
2016/09/01 Javascript
微信小程序-图片、录音、音频播放、音乐播放、视频、文件代码实例
2016/11/22 Javascript
微信小程序实战之自定义抽屉菜单(7)
2017/04/18 Javascript
JavaScript实现的冒泡排序法及统计相邻数交换次数示例
2017/04/26 Javascript
微信小程序button组件使用详解
2018/01/31 Javascript
JS实现鼠标拖拽盒子移动及右键点击盒子消失效果示例
2019/01/29 Javascript
PHP实现基于Redis的MessageQueue队列封装操作示例
2019/02/02 Javascript
JavaScript数据结构与算法之二叉树添加/删除节点操作示例
2019/03/01 Javascript
详解vue beforeRouteEnter 异步获取数据给实例问题
2019/08/09 Javascript
javascript+Canvas实现画板功能
2020/06/23 Javascript
微信小程序input抖动问题的修复方法
2021/03/03 Javascript
Python 加密的实例详解
2017/10/09 Python
详解如何使用Python编写vim插件
2017/11/28 Python
python实现数独游戏 java简单实现数独游戏
2018/03/30 Python
python实现判断一个字符串是否是合法IP地址的示例
2018/06/04 Python
python flask实现分页的示例代码
2018/08/02 Python
Win10环境python3.7安装dlib模块趟过的坑
2019/08/01 Python
兰芝美国网上商城:购买LANEIGE睡眠面膜等
2017/06/30 全球购物
戴森香港官方网站:Dyson香港
2021/02/11 全球购物
意大利奢侈品牌在线精品店:Jole.it
2020/11/23 全球购物
家长给学校的建议书
2014/05/15 职场文书
学雷锋的心得体会
2014/09/04 职场文书
关于运动会的广播稿
2015/08/19 职场文书
Python人工智能之混合高斯模型运动目标检测详解分析
2021/11/07 Python
Mysql Innodb存储引擎之索引与算法
2022/02/15 MySQL