使用js的方式让复选框单个选中(layui形式的checked)

一、标签部分

<script type="text/javascript" src="./lib/layui/layui.js" charset="utf-8"></script>

<div class="layui-unselect layui-form-checkbox selInfo " lay-skin="primary" id="30" onclick="synFile(this);"><i class="layui-icon"></i></div>

二、js部分

方法一:

<script>

var a=0;

function synFile (syso) {

a=a+1;

var i =  syso.getElementsByTagName("i")[0];
            var data = syso.getAttribute('data');
            alert(data);
            //i.className += ' selectCss';
            if(a%2==1){
                lookColor(i);
            }else{
                disColor(i);
            }

}

      //显示
      function lookColor(i){
            i.style.borderColor="#5FB878";
            i.style.backgroundColor="#5FB878";
            i.style.color="#fff";
            return;
      }
      //消失
      function disColor(i){
            i.style.borderColor="";
            i.style.backgroundColor="";
            i.style.color="";
            return;
      }

</script>

方法二:

<script>

var a=0;

function synFile (syso) {

    a=a+1;

    if(a%2==1){
            syso.className += ' header';
            syso.className += ' layui-form-checked';
        }else{
            removeClass(syso,"header");
            removeClass(syso,"layui-form-checked");
        }

}

//删除class
    function removeClass( elements,cName ){  
        if( hasClass( elements,cName ) ){  
            elements.className = elements.className.replace( new RegExp( "(\\s|^)" + cName + "(\\s|$)" )," " ); // replace方法是替换  
        };  
    };
    //判断元素是否有某个class
    function hasClass( elements,cName ){  
        return !!elements.className.match( new RegExp( "(\\s|^)" + cName + "(\\s|$)") ); // ( \\s|^ ) 判断前面是否有空格 (\\s | $ )判断后面是否有空格 两个感叹号为转换为布尔值 以方便做判断  
    };

</script>

猜你喜欢

转载自blog.csdn.net/weixin_42102798/article/details/80664379
今日推荐