所有的操作都将使用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的全选/取消的更多相关文章

  1. html checkbox 实现全选/取消全选

    html checkbox  实现全选/取消全选 <html> <body> <table border="1"> <tr> < ...

  2. 【转载】checkbox实现全选/取消全选

    比较简单.好理解的写法,做个备注.查看请前往原地址:http://blog.csdn.net/graceup/article/details/46650781 <html> <bod ...

  3. js实现checkbox组 全选和取消全选

    做后台管理程序时,用到一个checkbox组的全选和取消全选的功能, 主要是逻辑上的坑,理清后大概是: 1.全选点击后,小弟1~4都要选上,点击取消,小弟们也要取消 2.只要有一个小弟取消时,全选要取 ...

  4. Vue.js实现checkbox的全选和反选

    小颖之前写的代码存在一个bug,就是当你选择全选的时候去掉后面的一个选项,再点全选结果就是反的了.很感谢博客园的朋友帮我改了这个问题嘻嘻,下面一起来看看具体是怎么实现的吧. 1.html <te ...

  5. js实现checkbox的全选和全不选功能

    html代码: <form name="form1" method="post" action="manage.php?act=sub" ...

  6. asp.net中Repeater结合js实现checkbox的全选/全不选

    前台界面代码: <input name="CheckAll" type="checkbox" id="CheckAll" value= ...

  7. 用JavaScript实现CheckBox的全选取消反选,及遮罩层中添加内容

    <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

  8. JS 控制checkbox 获取 全选 全不选 一行不选择全选则不被选择 所有选择全选被选择

    //点击全选button的事件操作 function selectAll(){ var allcheckBoxs=document.getElementsByName("iTo") ...

  9. js中checkbox的全选和反选的实现

    <head> <meta charset="utf-8"/> <script type="text/javascript"> ...

随机推荐

  1. iOS 10 推送必看(高阶1)

    来源:徐不同 链接:http://www.jianshu.com/p/3d602a60ca4f iOS10 推送必看(基础篇) 虽然这篇文章比较长,也不好理解,但是还是建议大家收藏,以后用到的时候,可 ...

  2. web前端知识体系大全

    1. 前言 大约在几个月之前,让我看完了<webkit技术内幕>这本书的时候,突然有了一个想法.想把整个web前端开发所需要的知识都之中在一个视图中,形成一个完整的web前端知识体系,目的 ...

  3. SQL Server 中的事务和锁(三)-Range S-U,X-X 以及死锁

    在上一篇中忘记了一个细节.Range T-K 到底代表了什么?Range T-K Lock 代表了在 SERIALIZABLE 隔离级别中,为了保护范围内的数据不被并发的事务影响而使用的一类锁模式(避 ...

  4. java发送邮件 实现编辑html代码

    这个例子相当的简单,一看就懂(  此例仅支持163发送163及qq邮箱) 首先要导入两个必须jar包:mail-1.4.4.jar 和 commons-email-1.2.jar这两个jar包是我用的 ...

  5. 一、Android应用程序的基本原理(Fundamentals [,fʌndə'mentlz])

    Android 应用程序以java作为编程语言.Android SDK工具把代码连同数据.资源文件一起编译成一个以.apk为后缀(suffix)的android 程序存档(archive)文件包.在一 ...

  6. 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 ...

  7. PHP面向对象(一)

    一.类和对象 1.什么是类:类(class)是对一类事物的描述,是抽象.概念上的定义.是具有某些相同属性和功能行为的一些对象集合. 在面向对象的编程中,类是应该有一个类名并包括属性书名和功能说明两个主 ...

  8. 【Android Api 翻译2】Android Testing(1) 浅尝Android测试的奥秘

    ------- 源自梦想.永远是你IT事业的好友.只是勇敢地说出我学到! ---------- 仅供学习和交流使用,翻译不好勿喷,请只摘除不合适的地方 Testing The Android fram ...

  9. 利用apktool反编译apk

    下载apktool所需文件: a. apktool1.5.2.tar.bz2 b.apktool-install-windows-r05-ibot.tar.bz2  (windows系统) 步骤阅读 ...

  10. 20145102 Java 实验一

    20145102 Java 实验一 Java环境的安装 就像第一周写的一样,在linux下java的安装和配置简直简单的不行不行的,一个命令足以: sudo pacman -S jdk 配置什么的也就 ...