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 dom代码应用 简单的相册[firefox only]
Jun 12 Javascript
JavaScript日历实现代码
Sep 12 Javascript
基于jQuery的试卷自动排版系统实现代码
Jan 06 Javascript
Angular Js文件上传之form-data
Aug 28 Javascript
javascript输出AscII码扩展集中的字符方法
Dec 26 Javascript
老生常谈jquery id选择器和class选择器的区别
Feb 12 Javascript
Node.js 的模块知识汇总
Aug 16 Javascript
vue-cli开发环境实现跨域请求的方法
Apr 07 Javascript
Vue 按键修饰符处理事件的方法
May 04 Javascript
jQuery插件jsonview展示json数据
May 26 jQuery
bootstrap-table formatter 使用vue组件的方法
May 09 Javascript
el-table树形表格表单验证(列表生成序号)
May 31 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怎样调用MSSQL的存储过程
2006/10/09 PHP
关于时间计算的结总
2006/12/06 PHP
js限制checkbox勾选的个数以及php获取多个checkbbox的方法深入解析
2013/07/18 PHP
PHP生成迅雷、快车、旋风等软件的下载链接代码实例
2014/05/12 PHP
ThinkPHP之getField详解
2014/06/20 PHP
php遍历删除整个目录及文件的方法
2015/03/13 PHP
PHP命名空间namespace的定义方法详解
2017/03/29 PHP
浅谈PHP接入(第三方登录)QQ登录 OAuth2.0 过程中遇到的坑
2017/10/13 PHP
浅析PHP数据导出知识点
2018/02/17 PHP
Laravel框架Eloquent ORM简介、模型建立及查询数据操作详解
2019/12/04 PHP
javascript使用正则控制input输入框允许输入的值方法大全
2014/06/19 Javascript
详解js图片轮播效果实现原理
2015/12/17 Javascript
学习Angularjs分页指令
2016/07/01 Javascript
JavaScript实现一个空中避难的小游戏
2017/06/06 Javascript
Angularjs过滤器实现动态搜索与排序功能示例
2017/12/13 Javascript
微信小程序实现写入读取缓存详解
2019/08/30 Javascript
vue页面引入three.js实现3d动画场景操作
2020/08/10 Javascript
Python中还原JavaScript的escape函数编码后字符串的方法
2014/08/22 Python
Python计算三角函数之asin()方法的使用
2015/05/15 Python
基于python中pygame模块的Linux下安装过程(详解)
2017/11/09 Python
Python高级用法总结
2018/05/26 Python
Python 多维List创建的问题小结
2019/01/18 Python
使用python telnetlib批量备份交换机配置的方法
2019/07/25 Python
Python根据服务获取端口号的方法
2019/09/25 Python
python 模拟登录B站的示例代码
2020/12/15 Python
韩国演唱会订票网站:StubHub韩国
2019/01/17 全球购物
俄罗斯达美乐比萨外送服务:Domino’s Pizza
2020/12/18 全球购物
如何将字串String转换成整数int
2015/02/21 面试题
2013年学期结束动员演讲稿
2014/01/07 职场文书
生产助理岗位职责
2014/06/18 职场文书
党员检讨书
2014/10/13 职场文书
个人先进事迹材料
2014/12/29 职场文书
生产现场禁烟通知
2015/04/23 职场文书
运动会加油稿30字
2015/07/21 职场文书
MySQL如何解决幻读问题
2021/08/07 MySQL
MySQL数据库事务的四大特性
2022/04/20 MySQL