所有的操作都将使用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. BootStrap2学习日记16---选项卡内容

    代码: <ul class="nav nav-tabs"> <li class="active"><a href="#t ...

  2. 从零开始学JAVA(06)-WebService_Jersey_Restful

    由于项目上需要写一个简单的评价系统,像银行MM前面的那种非常满意.满意.不满意那种,结合一个安卓的APP一起使用.由于使用3G网页通讯,个人认为http这种方式更合适.曾经听在Delphi鸟窝群的白雪 ...

  3. windws 安装jdk

    (1) 到官网下载好jdk:http://www.oracle.com/technetwork/java/javase/downloads/jdk8-downloads-2133151.html (2 ...

  4. Ubuntu16.04安装VMware Tools问题

    *************************************************************************** 问题:客户机操作系统已将 CD-ROM 门锁定, ...

  5. JSP起源、JSP的运行原理、JSP的执行过程

    JSP起源 在很多动态网页中,绝大部分内容都是固定不变的,只有局部内容需要动态产生和改变. 如果使用Servlet程序来输出只有局部内容需要动态改变的网页,其中所有的静态内容也需要程序员用Java程序 ...

  6. Umbraco(3) - CSS & Javascript(翻译文档)

    原文地址:http://www.ncloud.hk/%E6%8A%80%E6%9C%AF%E5%88%86%E4%BA%AB/umbraco3css-javascript/ CSS & Jav ...

  7. HTML标签大全

    HTML标签解释大全 一.HTML标记 标签:!DOCTYPE 说明:指定了 HTML 文档遵循的文档类型定义(DTD). 标签:a 说明:标明超链接的起始或目的位置. 标签:acronym 说明:标 ...

  8. Differential Geometry之第四章标架与曲面论的基本定理

    第四章.标架与曲面论的基本定理 1.活动标架 2.自然标架的运动方程 爱因斯坦求和约定(Einstein summation convention) 3.曲面的结构方程 4.曲面的存在唯一性定理 5. ...

  9. 使用secureCRT连接VMware-Ubuntukylin虚拟机

    使用SecureCRT连接VMware时总是提醒主机拒绝连接.这时可以使用sudo apt-get install openssh-server openssh-client,在主机上安装ssh. 安 ...

  10. Cryptography - JavaScript 加密算法库

    Example 1: The following example uses aes function. <script type="text/javascript" src= ...