
本插件实现两个功能:
1、样式美化
2、选择文字也可以选中勾选框
代码很简单,下载下来看看src就明白了。
/**
* 功能说明:复选框/单选框的全选反选以及文字点击控制的插件
* @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
});
});