多选框全选实现批量删除

html代码

　　

<body>

	<form action="" method="post" name="FormName" onsubmit="return checkbox();">

		<table >

			<tr ><td><input type="checkbox" name="checkboxes[]" value="on" onclick="selectAll(this,'checkboxes')" /></td>

　　　　　　　　　　　　　　　　<td>全选</td></tr>  this代表windows窗口对象
			<tr>

				<td><input type="checkbox" name="checkboxes[]" value="2" /><td>游泳</td></td>

			</tr>

			<tr><td><input type="checkbox" name="checkboxes[]" value="1" /><td>绘画</td></td></tr>

			<tr><td><input type="checkbox" name="checkboxes[]" value="4" /><td>跑步</td></td></tr>

		</table>
　　　　　　　　　　<input type="hidden" id="getvalues" name="getvalues"/> 隐藏域传参数

		<button id="batch-delete-btn">批量删除</button> 
　　　　</form>
</body>

1.问题：怎么单击一个复选框实现全选

js代码实现

<script type="text/javascript">

    function selectAll(obj, chk)

{

　　if (chk == null)

  {

    chk = 'checkboxes';

  }

   var elems = obj.form.getElementsByTagName("INPUT");

 　for (var i=0; i < elems.length; i++)

  {

    if (elems[i].name == chk || elems[i].name == chk + "[]")

    {

      elems[i].checked = obj.checked;

     }

  }

}

</script>

方法二：

function CheckAll()
{
var ele =document.getElementsByTagName('input');
for(var i=0;i<ele.length;i++)
{
if(ele[i].name=='checkbox[]')
{
ele[i].checked=document.getElementById("chkAll").checked;
}
}
}

2.怎么把选中的id通过action传给php进行处理

通过juqery获取所有选中的box的value值，赋给一个变量，同时设置一个隐藏域把变量赋给隐藏域的value,通过POST提交，使得php页面获取所有id值

<script type="text/javascript">

    $(function(){

        $('#batch-delete-btn').click(function(){

             checked = [];

            $('input:checkbox:checked').each(function() {

                checked.push($(this).val());

            });

            $('#getvalues').val(checked);  给隐藏域设置属性

        })

    })

</script>

使用原生js获取

　

var compatibility = "",

input = document.getElementsByTagName("input"),
value;
for (var i = 0; i < input.length; i++) {
if (input[i].type == "checkbox") {
if (input[i].checked) {
value = input[i].value;
if(value!='on'){
compatibility += value + ",";
}

}
}
}
compatibility = compatibility.substring(0,compatibility.lastIndexOf(",")); 最后所有值拼接成的字符串
document.getElementById('getvalues').value=compatibility; 　　　　　　　　赋值给隐藏域

问题1.批量删除前判断是否有box选中

function checkbox() {

        var checkboxs=document.getElementById('getvalues').value; 　　如果隐藏域value为空表示没有被选中，return false 组织表单提交跳转，否则再次确定是否删除，确定返回true 表单跳转处理

        if(!checkboxs){

            alert('请选择要删除的会员');

            return false;

        }else{

            confirm('确定批量删除？');

        }

    }

　为题2.如果直接选择全选按钮选中全部，则在返回的id中   第一个全选按钮返回值为on　　所以需要把on 元素删除

on,6039,6038,6037,6036,6035,6034,6033,6032,6031,6030,6029,6027,6026,6025,6024

3.php页面对id元素处理

if(isset($_REQUEST['getvalues'])){   //批量删除会员

        $str=$_REQUEST['getvalues'];   返回的为一个字符串，如上

        $arrid=explode(',',$str);　　　　拆分字符串，如果为直接全选删除第一个元素

        if($arrid[0]=='on'){　　　　　　　　

            array_shift($arrid);

        }

        foreach($arrid as $v){　　　　遍历元素直接删除，也可以不便利直接把字符串传进sql语句里 id IN(+'$str'+);

            deleteUserById($v);

            deleteIdentityApproveByUserId($v);

            admin_log('会员信息删除-'.$v, 'edit', 'user');

        }

        showMsg('删除成功！','member.php?act=add','member.php?act=list');

    }

　　

checkbox复选框全选批量删除的更多相关文章

  1. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  2. js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中

    <!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...

  3. JavaScript小例子：复选框全选

    JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...

  4. Jquery表格变色 复选框全选，反选

    /*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...

  5. 复选框全选、全不选和反选的效果实现VIEW:1592

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  6. html+css+js实现复选框全选与反选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...

  7. js 判断 复选框全选、全不选、反选、必选一个

    一个挺 使用的 js 代码片段,  判断  复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...

  8. jQuery实现复选框 全选、反选、全不选

    <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"> <html> <hea ...

  9. jQuery 前端复选框 全选 反选 下拉菜单联动

    jQuery 页面中复选框全选.反选.下拉联动(级联) <!DOCTYPE html> <html lang="en"> <head> < ...

随机推荐

  1. 贪心(数据结构)：COGS 468. [NOI2010]超级钢琴

    ★★★☆   输入文件:piano.in   输出文件:piano.out   简单对比 时间限制:2 s   内存限制:512 MB 超级钢琴 [问题描述] 小Z是一个小有名气的钢琴家,最近C博士送 ...

  2. sql给整数补零

     update hs_user.clientorder a set a.stockcode = lpad(a.stockcode,6,'0')   where a.market = 'SZ' 

  3. 实时控制软件第一次作业--CNC软件系统分析

    作者:李君威U201310747 一.该系统有哪些强实时功能需求?需要对哪些实时事件进行实时响应,对允许的实时延迟的数量级进行估计. 答:在数控系统中,位置控制.插补计算.紧急控制等严格实时性任务需要 ...

  4. WebService-通俗讲解

    一.序言 大家或多或少都听过 WebService(Web服务),有一段时间很多计算机期刊.书籍和网站都大肆的提及和宣传WebService技术,其中不乏很多吹嘘和做广告的成 分.但是不得不承认的是W ...

  5. 如何从硬盘安装fedora 19 (How to install fedora 19 from hard drive, Fedora-19-i386-DVD.iso)

    现在fedora 19出来了, 它的安装界面与跟fedora 18相同,都是metro UI. 不过现在官方已经不再推荐下载i386,而是x86-64位了,是不是现在x86-64已经把兼容性做得很好了 ...

  6. Core OS 层

    Core OS层的底层功能是很多其他技术的构建基础.通常情况下,这些功能不会直接应用于应用程序,而是应用于其他框架.但是,在直接处理安全事务或和某个外设通讯的时候,则必须要应用到该层的框架. Acce ...

  7. 账户管理命令 useradd、groupadd

    内容提要: 1. 掌握用户的 增/删/改 命令 2. 掌握组的 增/删/改 命令 组管理 1)groupadd groupadd 用于添加组账号.格式如下: groupadd [-g GID] GRO ...

  8. 关于Xcode的Other Linker Flags

    背景 在ios开发过程中,有时候会用到第三方的静态库(.a文件),然后导入后发现编译正常但运行时会出现selector not recognized的错误,从而导致app闪退.接着仔细阅读库文件的说明 ...

  9. [转] restrict关键字用法

    PS: 在函数中,指针参数指定了restrict,表示这个指针指向的这段区域只能通过这个指针修改 c99中新增加了一个类型定义,就是restrict. 看了下网上的相关贴子,但还是问题解决的不够.下面 ...

  10. 屏幕录像专家V7.5(完美破解版，无水印)下载

    分享一个屏幕录像工具.屏幕录像专家V7.5(完美破解版,无水印).经测试可破解使用. 破解注册 点击安装.EXE,安装软件. 点击安装好的屏幕录像专家,会给你一个机器码,要你注册,复制下这个机器码(下 ...