JQuery动态操作表格(添加、删除、多选、全选删除行操作)
来源：互联网 发布：不可抗力网络剧百度云 编辑：程序博客网 时间：2024/05/18 17:02
JQery动态操作表格，能够实现 添加行，多选、全选行、删除行操作，这是一个很有参考价值的JQuery适时控制表格的一个功能，含有丰富的注释，方便大家研究学习。
<%@ page language="java" pageEncoding="UTF-8"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<head>
<title>JQuery单元格新增与删除</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>
<script type="text/javascript">
$(function(){
//添加单元表格行信息
$("#saveInfo").bind("click",function(){
$("#tb").append("<tr align='center'><td><input type='checkbox'/></td><td>"+$("#UserName").val()+"</td><td>"+$("#PassWord").val()+"</td></tr>");
});
//重置用户添加信息
$("#deleteInfo").bind("click",function(){
$("#UserName").val("");//置用户名值为空
$("#PassWord").val("");//置密码值为空
});
//单元表格行全选
$("#SelectAll").bind("click",function(){
$("#tb tbody tr td input").attr("checked",true);
});
//删除单元格行信息
$("#Delete").bind("click",function(){
$("#tb tbody tr td input:checked").parent().parent().remove();
});
});
</script>
</head>
<body>
<table align="center" border="0">
<tr>
<td>用户名:</td><td><input type="text" id="UserName"/></td>
</tr>
<tr>
<td>密 码:</td><td><input type="text" id="PassWord"/></td>
</tr>
<tr>
<td><input type="button" value="确 认" id="saveInfo"/></td>
<td><input type="reset" value="重 置" id="deleteInfo"/></td>
</tr>
</table>
<table align="center" border="1" width="70%" id="tb">
<thead>
<tr>
<th><input type="button" id="SelectAll" value="全选"/> <input type="button" id="Delete" value="删除"/></th>
<th>用户名</th>
<th>密 码</th>
</tr>
</thead>
<tbody></tbody>
</table>
</table>
</html>
- JQuery动态操作表格(添加、删除、多选、全选删除行操作)
- JQuery动态操作表格(添加、删除、多选、全选删除行操作)
- jQuery表格操作添加行、删除行和动态移动
- jQuery表格操作添加行、删除行和动态移动
- jquery操作表格(添加/删除行、添加/删除列)
- JavaScript动态操作表格，添加，删除行、列及单元格
- JavaScript动态操作表格，添加，删除行、列及单元格
- JavaScript动态操作表格，添加，删除行、列及单元格
- html表格动态添加删除行(有后台操作）
- js动态添加表格,全选和删除
- jQuery动态添加、删除表格行
- Jquery动态给表格添加、删除行
- JQuery动态添加删除表格
- jquery表格动态添加删除
- JS 删除添加表格的行操作
- jquery表格增加删除行操作
- jquery操作表格行（增加、删除）
- jQuery操作表格元素，整体添加与删除
- 97 Things Every Software Architect Should Know
- 排序算法
- mac开发入门
- 转载：Posix多线程编程学习笔记
- 《python编程入门经典》学习笔记–第八章（一）
- JQuery动态操作表格(添加、删除、多选、全选删除行操作)
- AndEngine编译
- 感《明朝后期的中缅战争》
- 练习题
- Chapter09-"内核模式下的线程同步"之等待函数
- 几道水博弈
- POJ 2152(树形DP)
- 未能找到类型或命名空间名称“XXXX”(是否缺少 using 指令或程序集引用?)
- 阻止局域网中的ARP攻击
