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 相关文章推荐
入门基础学习 ExtJS笔记(一)
Nov 11 Javascript
jQuery学习笔记之jQuery的事件
Dec 22 Javascript
Javascript中对象继承的实现小例
May 12 Javascript
使用JQuery实现Ctrl+Enter提交表单的方法
Oct 22 Javascript
js点击文本框弹出可选择的checkbox复选框
Feb 03 Javascript
vue.js学习之vue-cli定制脚手架详解
Jul 02 Javascript
使用javaScript实现鼠标拖拽事件
Apr 03 Javascript
微信小程序实现form表单本地储存数据
Jun 27 Javascript
原生JS实现天气预报
Jun 16 Javascript
echarts.js 动态生成多个图表 使用vue封装组件操作
Jul 19 Javascript
vue treeselect获取当前选中项的label实例
Aug 31 Javascript
js实现菜单跳转效果
Dec 11 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
德劲1103二次变频版的打磨
2021/03/02 无线电
PHP 用数组降低程序的时间复杂度
2009/12/04 PHP
PHP批量生成静态HTML的简单原理和方法
2014/04/20 PHP
php基本函数汇总
2015/07/09 PHP
Thinkphp3.2.3整合phpqrcode生成带logo的二维码
2016/07/21 PHP
thinkphp5框架API token身份验证功能示例
2019/05/21 PHP
浅谈JavaScript编程语言的编码规范
2011/10/21 Javascript
Grunt入门教程(自动任务运行器)
2015/08/06 Javascript
jquery中实现时间戳与日期相互转换
2016/04/12 Javascript
jQuery代码实现实时获取时间
2017/01/29 Javascript
jquery append与appendTo方法比较
2017/05/24 jQuery
Vue Spa切换页面时更改标题的实例代码
2017/07/15 Javascript
浅谈Vue.js 1.x 和 2.x 实例的生命周期
2017/07/25 Javascript
javascript中的this作用域详解
2019/07/15 Javascript
利用layer实现表单完美验证的方法
2019/09/26 Javascript
vue制作抓娃娃机的示例代码
2020/04/17 Javascript
flask框架视图函数用法示例
2018/07/19 Python
对Python _取log的几种方式小结
2019/07/25 Python
使用Python刷淘宝喵币(低阶入门版)
2019/10/30 Python
python 实现dict转json并保存文件
2019/12/05 Python
python线程join方法原理解析
2020/02/11 Python
Python 基于jwt实现认证机制流程解析
2020/06/22 Python
Pycharm 如何一键加引号的方法步骤
2021/02/05 Python
世界上最大的隐形眼镜商店:1-800 Contacts
2018/11/03 全球购物
行政部总经理岗位职责
2014/01/04 职场文书
应届护士求职信范文
2014/01/26 职场文书
文明礼仪演讲稿
2014/05/12 职场文书
2014年护士长工作总结
2014/11/11 职场文书
网上祭英烈活动总结
2015/02/04 职场文书
干货!开幕词的写作方法
2019/04/02 职场文书
pytorch显存一直变大的解决方案
2021/04/08 Python
python实现自动化群控的步骤
2021/04/11 Python
详解MySQL事务的隔离级别与MVCC
2021/04/22 MySQL
MySQL REVOKE实现删除用户权限
2021/06/18 MySQL
多台电脑共享文件怎么设置?多台电脑共享文件操作教程
2022/04/08 数码科技
Python获取字典中某个key的value
2022/04/13 Python