在后台管理中经常会遇到列表全选和取消的功能，如评论审核、申请等，用到的html标记就是checkbox。我用的是mysql数据库，代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

<html>

<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">

<title>全选和取消全选</title>

</head>

<body>

<table>

    <!-- 这里用整形的数字编号作为值-->

    <tr><td><input type="checkbox" class="check" value="1"/>苹果</td></tr>

    <tr><td><input type="checkbox" class="check" value="2"/>梨子</td></tr>

    <tr><td><input type="checkbox" class="check" value="3"/>橘子</td></tr>

    <tr><td><input type="checkbox" class="check" value="4"/>香蕉</td></tr>

    <tr><td><input type="checkbox" class="check" value="5"/>番茄</td></tr>

    <tr><td><input type="checkbox" class="check" value="6"/>黄瓜</td></tr>

    <tr><td><input type="checkbox" class="check" value="7"/>土豆</td></tr>

    <tr><td><input type="checkbox" class="check" value="8"/>莲藕</td></tr>

    <tr><td><input type="checkbox" id="choose"/>全选/取消</td><td id="do_choose">确定</td></tr>

</table>

<script src="http://apps.bdimg.com/libs/jquery/1.6.4/jquery.min.js"></script>

<script>

    //全选和取消

    $('#choose').click(function(){

        if($(this).attr('checked') == 'checked'){//全选

            $('input.check').attr('checked', 'checked');

        }else{//取消全选

            $('input.check').removeAttr('checked');

        }

    });

    //获取选择的值

    $('#do_choose').click(function(){

        var test = $('input.check:checked');

        console.log(test);

        if(test.length == 0){

            alert('请选择！');

        }else{

            var str = '';

            test.each(function(i){

                if(i == 0){

                    str +=  parseInt($(this).val());    //需要将获取到的字符串值转为整数，下同

                }else{

                    str += ',' + parseInt($(this).val());

                }

            });

            alert(str);//这里是获取到的数据，连接成','隔开的字符串是为了方便数据库使用'in'关键字。

        }

    });

</script>

</body>

</html>

jquery实现checkbox全选和全部取消，以及获取值的更多相关文章

  1. jquery中checkbox全选失效的解决方法

    这篇文章主要介绍了jquery中checkbox全选失效的解决方法,需要的朋友可以参考下     如果你使用jQuery 1.6 ,代码if ( $(elem).attr(“checked”) ),将 ...

  2. jQuery实现CheckBox全选、全不选

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. jQuery设置checkbox全选（区别jQuery版本）

    jQuery设置checkbox全选在网上有各种文章介绍,但是为什么在我们用他们的代码的时候就没有效果呢? 如果你的代码一点错误都没有,先不要急着怀疑人家代码的正确性,也许只是人家跟你用的jQuery ...

  4. 利用jQuery实现CheckBox全选/全不选/反选

    转自:http://www.cnblogs.com/linjiqin/p/3148259.html jQuery有些版本中实现CheckBox全选/全不选/反选会有bug,经测试jquery-1.3. ...

  5. Jquery 组 checkbox全选checkbox

    <!DOCTYPE html><html lang="zh-cn"><head> <meta charset="utf-8&qu ...

  6. Jquery实现checkbox全选、取消全选和反选

    最近在看廖雪峰的Jquery教程,事件篇的练习题比较综合,研究了很久终于研究出来了,现在分享出来,提供给小白学习.题目如下: 首先要获取到全选checkbox和每一项的checkbox,然后通过逻辑代 ...

  7. jQuery checkbox全选 和全部取消

    1.chkAll选中,全部chk选中  ,chkAll取消选中,全部chk取消选中 //chkAll选中,全部chk选中 ,chkAll取消选中,全部chk取消选中 $("#chkAll&q ...

  8. 解决jquery操作checkbox全选全不选无法勾选问题

    最近在学习中使用jquery操作checkbox,使用下面方法进行全选.反选:$("input[name='checkbox']").attr("checked" ...

  9. jquery的checkbox 全选和全不选

    今天写了一个checkbox的全选和全不选的功能: var check_all=function(){ if(this.checked){ //alert($(".adv_check_num ...

随机推荐

  1. A python script to check NE syncfail and get log from CIPS

    #! /usr/bin/env python # -*- coding: UTF-8 -*- """The script is to check whether NE i ...

  2. destoon系统中get_maincat的用法及解释

    get_maincat函数的用法, 如get_maincat(0, $mid, 1),其中第一.二.三个参数分别表示什么? 第一个参数代表parentid 第二个参数代表所有的分类 第三个参数 代表 ...

  3. select元素中设置padding效果

    更新2016-9-17:这个bug是在mac os上的发生,在window系统中不存在这个问题! 给select元素增加:padding-left:20px;但是未生效,如下图所示: 在select上 ...

  4. ASP.NET MVC 静态资源打包和压缩问题小记

    ASP.NET MVC 中有个 BundleConfig 用于静态资源的打包和压缩,我在使用的过程中遇到一些问题,现在做下总结,并给出具体的解决方案. 问题一:打包压缩后的 JavaScript 和 ...

  5. SpringMVC生成任意文件,访问链接即下载

    原理上讲就是返回的 ResponseEntity<byte[]> 形式的值就可以了 @RequestMapping("/api/watermark_download") ...

  6. About LIS(Longest Increasing Subsequence)

    今天528给讲了基础的DP,其中第一道例题就是最长不下降子序列——LIS. 题目简述:给出N个数,求最长不下降子序列的长度. 数据范围:30% N<=1000 ; 100% N<=1000 ...

  7. Java 中如何原样输出转义符号

    Java 中的转义字符有好几种,常见的有: 八进制转义字符,格式:\ + 1到3位八进制数字,如\1, \20,范围为 \0 ~ \377,即最大值为255. Unicode转义字符,格式:\u + ...

  8. Docker容器是否可以改变世界？

    Docker容器是否可以改变世界? 2016-01-15 杜亦舒 2016年了,很多大牛开始预测技术趋势,其中一个普遍的观点我也很认同: Docker会更加流行,会改变程序世界 2015年的上半年我接 ...

  9. centos各版本信息

    CentOS version Architectures RHEL base Kernel CentOS release date RHEL release date Delay (days) 2.1 ...

  10. Android N preview 试用

    一.下载更新包 下载地址:https://developer.android.com/intl/zh-cn/preview/download.html 注意下载适合你手机的安装包哦 二.把你手机的oe ...