在后台管理中经常会遇到列表全选和取消的功能，如评论审核、申请等，用到的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. 一次U盘拯救的经历

    U盘拷资料,突然就弹出框框,复制终止了,然后U盘里面的只是编程可读的了. 倒是没有啥重要的资料,就是只有这一个U盘了,平时传资料都靠它,不能就这么垮了啊,于是就来了一次拯救行动. 一共有三个步骤 第一 ...

  2. ShareSDK 集成 Google+ 登录 400. Error:redirect_uri_mismatch 和 Error Domain=ShareSDKErrorDomain Code=204

    最近在集成ShareSDK中 Google+ 登录授权时候 出现了如下几个问题 1.    400.  Error:redirect_uri_mismatch 出现这种情况, redirectUri应 ...

  3. 调用微信JsAPI端获取位置

    public partial class test : BasePage { protected test() { AccessPage = PageWebType.WX; } protected s ...

  4. SublimeText2 快捷键一览表

    SublimeText2 快捷键一览表 Sublime Text比起Notepad++,UltraEdit之类Code编辑器来说,其功能有过之而无不及,配合着各种插件使用,Sublime Text在实 ...

  5. PNG的使用技巧

    Png是图像文件存储格式,在网页设计中已经不是一个陌生的名词,在前端开发中经常使用到它,如常用CSS 雪碧图.而Png的使用不仅仅如此,Png有多少种格式,有哪些特点,PC端中常用的Png格式是哪些, ...

  6. 【Java】需要注意的小细节

    一.==和equals 1.比较两个变量时 a.==可以判断两个变量是否相等,如果两个变量是基本类型变量,而且是数值类型,只要两个变量值相等,返回true. 2.比较两个引用变量 a.==只有两个引用 ...

  7. C#： DataBase

    using System.Data.SqlClient; namespace WindowsFormsApplication1{ class DB { private SqlConnection co ...

  8. Attendance

    1.打怪 福利好美味(色.... 努力是为了,遇到你时,可以不用因为种种而错过. 一公司的老板对一位职员说:“我出10万买你的老婆,你卖吗?” 职员微笑着说:“那我出15万买你老婆,你同意吗?” 老板 ...

  9. 判断iframe是否加载完成的完美方法

    var iframe = document.createElement("iframe"); iframe.src = "http://www.jb51.net" ...

  10. 声明变量，一定要用 var！

    public static T TryGet<T>(Func<T> func, T ifError = default(T)) { try { return func(); } ...