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 相关文章推荐
js href的用法
May 13 Javascript
asp.net 30分钟掌握无刷新 Repeater
Sep 16 Javascript
js通过location.search来获取页面传来的参数
Sep 11 Javascript
node.js中watch机制详解
Nov 17 Javascript
jquery.form.js框架实现文件上传功能案例解析(springmvc)
May 26 Javascript
详谈Ajax请求中的async:false/true的作用(ajax 在外部调用问题)
Feb 10 Javascript
bootstrap datetimepicker日期插件超详细使用方法介绍
Feb 23 Javascript
JavaScript算法教程之sku(库存量单位)详解
Jun 29 Javascript
基于BootStrap的文本编辑器组件Summernote
Oct 27 Javascript
使用Vue动态生成form表单的实例代码
Apr 26 Javascript
javascript数组的定义及操作实例
Nov 10 Javascript
js闭包和垃圾回收机制示例详解
Mar 01 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与数据库代码开发规范
2013/08/08 PHP
php 伪造ip以及url来路信息方法汇总
2014/11/25 PHP
Yii2中OAuth扩展及QQ互联登录实现方法
2016/05/16 PHP
基于ThinkPHP5框架使用QueryList爬取并存入mysql数据库操作示例
2019/05/25 PHP
Laravel find in set排序实例
2019/10/09 PHP
使javascript也能包含文件
2006/10/26 Javascript
Jquery下的26个实用小技巧(jQuery tips, tricks & solutions)
2010/03/01 Javascript
基于jQuery的公告无限循环滚动实现代码
2012/05/11 Javascript
jQuery获得内容和属性示例代码
2014/01/16 Javascript
点击显示指定元素隐藏其他同辈元素的方法
2014/02/19 Javascript
js的for in循环和java里foreach循环的区别分析
2015/01/28 Javascript
jQuery对象与DOM对象之间的相互转换
2015/03/03 Javascript
JavaScript使用Max函数返回两个数字中较大数的方法
2015/04/06 Javascript
实例讲解避免javascript冲突的方法
2016/01/03 Javascript
js计算系统当前日期是星期几的方法
2016/07/14 Javascript
微信小程序 UI与容器组件总结
2017/02/21 Javascript
Angular 2 ngForm中的ngModel、[ngModel]和[(ngModel)]的写法
2017/06/29 Javascript
vue 子组件向父组件传值方法
2018/02/26 Javascript
详解Webpack如何引入CDN链接来优化编译后的体积
2019/06/21 Javascript
jquery插件开发模式实例详解
2019/07/20 jQuery
angularjs请求数据的方法示例
2019/08/06 Javascript
MySQLdb ImportError: libmysqlclient.so.18解决方法
2014/08/21 Python
Scrapy的简单使用教程
2017/10/24 Python
python密码错误三次锁定(实例讲解)
2017/11/14 Python
Python global全局变量函数详解
2018/09/18 Python
详解Python locals()的陷阱
2019/03/26 Python
详解python之heapq模块及排序操作
2019/04/04 Python
通过cmd进入python的实例操作
2019/06/26 Python
python GUI库图形界面开发之PyQt5开发环境配置与基础使用
2020/02/25 Python
python实现mean-shift聚类算法
2020/06/10 Python
Made in Design英国:设计家具、照明、家庭装饰和花园家具
2019/09/24 全球购物
环境工程与管理大学毕业生求职信
2013/10/02 职场文书
房产销售独家委托书范本
2014/10/01 职场文书
和谐拯救危机观后感
2015/06/15 职场文书
简历中的自我评价应该这样写!
2019/07/12 职场文书
动画《朋友游戏》公开佐藤友生绘制的开播纪念绘
2022/04/06 日漫