checkbox样式美化及全选反选插件


1973 | 314  | 628 | 添加收藏 上一个 下一个
资源描述 : 复选框单选框的美化及勾选插件
checkbox样式美化及全选反选插件
资源详情

本插件实现两个功能:


1、样式美化


2、选择文字也可以选中勾选框


代码很简单,下载下来看看src就明白了。


/**
* 功能说明:复选框/单选框的全选反选以及文字点击控制的插件
* @author:vivy <lizhiziyan@qq.com>
* @time:2016-08-22 11:15:30
* @version:V1.1.0
* @js调用方法[复选框]:
* $("#id").selectCheck({
* parentSelect:"p",//支持文字也选中的标签,例子中时P标签,根据具体情况换成li,div等。不需要要控制时设为null
* allId: 'checkAll',//全选反选input的ID,如果不需要全选反选,则设置为nul
* toggleClass: 'check_span--checked',//改变的样式名,针对例子中的复选框样式美化
* checkCallBack:function(obj,bool){}//选择之后回调函数,返回obj的是否选中
* })
* @js调用方法[单选框]:
* $("#id").selectRadio({
* parentSelect:"p",//支持文字也选中的标签,例子中时P标签,根据具体情况换成li,div等。不需要要控制时设为null
* toggleClass: 'radio_span--checked'//改变的样式名,针对例子中的复选框样式美化
* })
*
*/

页面调用:


$(function() {
    //有全选且点文字可以选中
    $("#checkbox").selectCheck();
    //无全选且只能点击勾选框
    $("#checkbox1").selectCheck({
        allId: null,
        parentSelect: null
    });
    //点文字可选中
    $("#radiobox").selectRadio();
    //只能点击单选框
    $("#radiobox1").selectRadio({
        parentSelect: null
    });
});


指尖代码 资源每日更新 www.zjdaima.com