js实现checkbox的全选/取消
所有的操作都将使用jquery进行。
主要是为了实现指定内容的批量/单独删除操作。
先看一下页面的设计。
实现操作的主要地方是:
首先实现单击“标题”旁的checkbox实现所有条目的选择。
要点:jquery选择器
PHP代码如下:
将checkbox命名为“checkall”和“checklist”。届时,点击“checkall”时候
会通过选择器,将所有“checklist”选中,再进行“删除”。
实现全选/取消功能:
$("#checkAll").click(function(){
if(this.checked){
$("input[name='checklist']").each(function(){
this.checked=true;
});
}else{
$("input[name='checklist']").each(function(){
this.checked=false;
});
}
}
);
实现获取已选择的checkbox内容(点击“删除”)
$("#delSelected").click(function(){
vararrCheck=$("input[name='checklist']:checked");
vararrT=[];
$(arrCheck).each(function(){
arrT.push(this.id);
});
});
剩下的事情就是将获取到的信息通过ajax使用post发给指定action去处理了。
js实现checkbox的全选/取消的更多相关文章
- html checkbox 实现全选/取消全选
html checkbox 实现全选/取消全选 <html> <body> <table border="1"> <tr> < ...
- 【转载】checkbox实现全选/取消全选
比较简单.好理解的写法,做个备注.查看请前往原地址:http://blog.csdn.net/graceup/article/details/46650781 <html> <bod ...
- js实现checkbox组 全选和取消全选
做后台管理程序时,用到一个checkbox组的全选和取消全选的功能, 主要是逻辑上的坑,理清后大概是: 1.全选点击后,小弟1~4都要选上,点击取消,小弟们也要取消 2.只要有一个小弟取消时,全选要取 ...
- Vue.js实现checkbox的全选和反选
小颖之前写的代码存在一个bug,就是当你选择全选的时候去掉后面的一个选项,再点全选结果就是反的了.很感谢博客园的朋友帮我改了这个问题嘻嘻,下面一起来看看具体是怎么实现的吧. 1.html <te ...
- js实现checkbox的全选和全不选功能
html代码: <form name="form1" method="post" action="manage.php?act=sub" ...
- asp.net中Repeater结合js实现checkbox的全选/全不选
前台界面代码: <input name="CheckAll" type="checkbox" id="CheckAll" value= ...
- 用JavaScript实现CheckBox的全选取消反选,及遮罩层中添加内容
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...
- JS 控制checkbox 获取 全选 全不选 一行不选择全选则不被选择 所有选择全选被选择
//点击全选button的事件操作 function selectAll(){ var allcheckBoxs=document.getElementsByName("iTo") ...
- js中checkbox的全选和反选的实现
<head> <meta charset="utf-8"/> <script type="text/javascript"> ...
随机推荐
- iOS 10 推送必看(高阶1)
来源:徐不同 链接:http://www.jianshu.com/p/3d602a60ca4f iOS10 推送必看(基础篇) 虽然这篇文章比较长,也不好理解,但是还是建议大家收藏,以后用到的时候,可 ...
- web前端知识体系大全
1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...
- SQL Server 中的事务和锁(三)-Range S-U,X-X 以及死锁
在上一篇中忘记了一个细节.Range T-K 到底代表了什么?Range T-K Lock 代表了在 SERIALIZABLE 隔离级别中,为了保护范围内的数据不被并发的事务影响而使用的一类锁模式(避 ...
- java发送邮件 实现编辑html代码
这个例子相当的简单,一看就懂( 此例仅支持163发送163及qq邮箱) 首先要导入两个必须jar包:mail-1.4.4.jar 和 commons-email-1.2.jar这两个jar包是我用的 ...
- 一、Android应用程序的基本原理(Fundamentals [,fʌndə'mentlz])
Android 应用程序以java作为编程语言.Android SDK工具把代码连同数据.资源文件一起编译成一个以.apk为后缀(suffix)的android 程序存档(archive)文件包.在一 ...
- How to solve the SVDI SN Number Display Problem
Yesterday we have learn how to find the SVDI Serial Number, today one of customer from UK look our a ...
- PHP面向对象(一)
一.类和对象 1.什么是类:类(class)是对一类事物的描述,是抽象.概念上的定义.是具有某些相同属性和功能行为的一些对象集合. 在面向对象的编程中,类是应该有一个类名并包括属性书名和功能说明两个主 ...
- 【Android Api 翻译2】Android Testing(1) 浅尝Android测试的奥秘
------- 源自梦想.永远是你IT事业的好友.只是勇敢地说出我学到! ---------- 仅供学习和交流使用,翻译不好勿喷,请只摘除不合适的地方 Testing The Android fram ...
- 利用apktool反编译apk
下载apktool所需文件: a. apktool1.5.2.tar.bz2 b.apktool-install-windows-r05-ibot.tar.bz2 (windows系统) 步骤阅读 ...
- 20145102 Java 实验一
20145102 Java 实验一 Java环境的安装 就像第一周写的一样,在linux下java的安装和配置简直简单的不行不行的,一个命令足以: sudo pacman -S jdk 配置什么的也就 ...