jq checkbox 的全选并ajax传参的实例


Posted in Javascript onApril 01, 2017

实例如下:

/全选按钮
  $("#all").click(function(){
    if(this.checked){  
      $(":checkbox").prop("checked", true);  
    }else{  
      $(":checkbox").removeAttr("checked");
    }

  });

  $("#form").on('click','.ids',function(){
    var chknum = $("input[name='ids']:checkbox").size();//选项总个数
    var chk = 0;
    $("input[name='ids']:checkbox:checked").each(function () {  
        chk++;
    });

    if(chknum==chk){//全选
      $("#all").prop("checked",true);
    }else{//不全选
      $("#all").removeAttr("checked");
    }
  });
  
  //上下架
   $('#form').on('click','.up,.down',function(){
    var my = $(this);     
    var val = my.data('status');
    var url = my.data('url');

    var valArr = new Array;
    $("input[name='ids']:checkbox:checked").each(function(i){
      valArr[i] = $(this).val();
    });
    var vals = valArr.join(',');

    
    $.ajax({
      url: my.data('url'),
      method: 'post',
      data: {
        status: val,
        ids:vals
      },
      success: function() {
        $("#all").removeAttr("checked");
        table.search();
      }
    });
  
  });

以上这篇jq checkbox 的全选并ajax传参的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
用javascript获取textarea中的光标位置
May 06 Javascript
在JS中如何调用JSP中的变量
Jan 22 Javascript
JavaScript实现把rgb颜色转换成16进制颜色的方法
Jun 01 Javascript
jQuery实现将页面上HTML标签换成另外标签的方法
Jun 09 Javascript
jQuery实现带滚动导航效果的全屏滚动相册实例
Jun 19 Javascript
浅谈jquery的map()和each()方法
Jun 12 Javascript
原生JS实现移动端web轮播图详解(结合Tween算法造轮子)
Sep 10 Javascript
使用Vue自定义数字键盘组件(体验度极好)
Dec 19 Javascript
Django+Vue跨域环境配置详解
Jul 06 Javascript
d3.js实现图形拖拽
Dec 19 Javascript
vue实现学生信息管理系统
May 30 Javascript
Vue + Element-ui的下拉框el-select获取额外参数详解
Aug 14 Javascript
js实现音频控制进度条功能
Apr 01 #Javascript
ES6(ECMAScript 6)新特性之模板字符串用法分析
Apr 01 #Javascript
Linux CentOS系统下安装node.js与express的方法
Apr 01 #Javascript
原生JS实现九宫格抽奖效果
Apr 01 #Javascript
关于Node.js的events.EventEmitter用法介绍
Apr 01 #Javascript
ES6 Promise对象概念与用法分析
Apr 01 #Javascript
JavaScript中闭包的详解
Apr 01 #Javascript
You might like
php简单定时执行任务的实现方法
2015/02/23 PHP
Yii2实现让关联字段支持搜索功能的方法
2016/08/10 PHP
php实现基于pdo的事务处理方法示例
2017/07/21 PHP
PHP+Ajax实现的博客文章添加类别功能示例
2018/03/29 PHP
jquery 图片预加载 自动等比例缩放插件
2008/12/25 Javascript
Javascript技巧之不要用for in语句对数组进行遍历
2010/10/20 Javascript
jQuery 选择器、DOM操作、事件、动画
2010/11/25 Javascript
推荐4个原生javascript常用的函数
2015/01/12 Javascript
JS实现鼠标箭头变成一个燃烧烛光效果的方法
2015/02/28 Javascript
text-align:justify实现文本两端对齐 兼容IE
2015/08/19 Javascript
JS实现仿QQ效果的三级竖向菜单
2015/09/25 Javascript
jQuery弹层插件jquery.fancybox.js用法实例
2016/01/22 Javascript
jQuery 全选 全部选 反选 实现代码
2016/08/17 Javascript
JS中作用域和变量提升(hoisting)的深入理解
2016/10/31 Javascript
用Object.prototype.toString.call(obj)检测对象类型原因分析
2018/10/11 Javascript
微信小程序在地图选择地址并返回经纬度简单示例
2018/12/03 Javascript
Node.js之readline模块的使用详解
2019/03/25 Javascript
extjs图形绘制之饼图实现方法分析
2020/03/06 Javascript
小程序实现上下切换位置
2020/11/16 Javascript
Python写的英文字符大小写转换代码示例
2015/03/06 Python
python机器学习之贝叶斯分类
2018/03/26 Python
python判断一个集合是否为另一个集合的子集方法
2018/05/04 Python
谈谈Python中的while循环语句
2019/03/10 Python
深入解析Python小白学习【操作列表】
2019/03/23 Python
Win10下Python3.7.3安装教程图解
2019/07/08 Python
Python根据服务获取端口号的方法
2019/09/25 Python
通过Python扫描代码关键字并进行预警的实现方法
2020/05/24 Python
Python调用.net动态库实现过程解析
2020/06/05 Python
解决Python 函数声明先后顺序出现的问题
2020/09/02 Python
美国二手复古奢侈品包包购物网站:LXRandCo
2019/06/18 全球购物
仓库管理专业个人自我评价范文
2013/11/11 职场文书
奥巴马胜选演讲稿
2014/05/15 职场文书
超市优秀员工获奖感言
2014/08/15 职场文书
2014年司法局工作总结
2014/12/11 职场文书
Oracle数据库事务的开启与结束详解
2022/06/25 Oracle
详解Anyscript开发指南绕过typescript类型检查
2022/09/23 Javascript