zoukankan      html  css  js  c++  java
  • bootstrap 中的 iCheck 全选反选功能的实现

    喜欢bootstrap 风格的同学应该知道,iCheck的样式还是很好看的。

    官网: http://www.bootcss.com/p/icheck/

    进入正题,iCheck提供了一些方法,可以进行全选和反选的判定。

      ifChecked:输入框的状态变为 checked

      ifUnchecked:checked 状态被移除

      ifChanged:输入框的 checked 或 disabled 状态改变了

        var checkAll =$('input.all');  //全选的input
        var checkboxs =$('input.check'); //所有单选的input
    
        checkAll.on('ifChecked ifUnchecked',function(event){
          if(event.type == 'ifChecked'){
            checkboxs.iCheck('check');
          }else{
            checkboxs.iCheck('uncheck');
          }
        });
    
        checkboxs.on('ifChanged',function(event){
          if(checkboxs.filter(':checked').length == checkboxs.length){
            checkAll.prop('checked',true);
          }else{
            checkAll.prop('checked',false);
          }
          checkAll.iCheck('update');
        })

    PS:其实本人是很讨厌bootstrap的,奈何公司。。。;

       之前不知道怎么写,看了各个网站,发现他们判断状态改变是这样写的

    removeProp()这个方法我认为不太好,会出现无法移除的bug,说到这里就有点生气了,你说你分享你的知识的时候都不测试的吗???昂!

    removeProp()用于移除由 prop() 添加的属性,不要使用该方法来移除诸如 style、id 或 checked 之类的 HTML 属性。

    可以用removeAttr(),或者 prop('checked',false)替代;

    *removeAttr() 这个好像也是有点问题的,自行试试。

  • 相关阅读:
    项目下目录正确,却出现404
    Operation not allowed after ResultSet closed 结果集关闭异常
    Could not autowire.No beans of 'ItemsService' type found
    python,hashlib模块
    Ajax PHP项目实战
    PHP的数据类型总结
    解析导航栏的url
    PHP--冒泡、选择、插入排序法
    jQuery(二) jQuery对Ajax的使用
    easyui(一) 初始easyui
  • 原文地址:https://www.cnblogs.com/wyhlightstar/p/6862464.html
Copyright © 2011-2022 走看看