iCkeck插件
iCheck
特色:
1、在不同浏览器(包括ie6+)和设备上都有相同的表现 — 包括 桌面和移动设备
2、支持触摸设备 — iOS、Android、BlackBerry、Windows Phone等系统
4、方便定制 — 用HTML 和 CSS 即可为其设置样式 (多套皮肤)
5、体积小巧 — gzip压缩后只有1 kb
6、25 种参数 用来定制复选框(checkbox)和单选按钮(radio button)
7、8 个回调事件 用来监听输入框的状态
8、7个方法 用来通过编程方式控制输入框的状态
9、能够将输入框的状态变化同步回原始输入框中, 支持所有选择器
使用方法:
$('input').iCheck('check'); //将输入框的状态设置为checked
$('input').iCheck('uncheck'); //移除 checked 状态
$('input').iCheck('toggle'); //toggle checked state
$('input').iCheck('disable'); //将输入框的状态设置为 disabled
$('input').iCheck('enable'); //移除 disabled 状态
$('input').iCheck('update'); //apply input changes, which were done outside the plugin
$('input').iCheck('destroy'); //移除iCheck样式
//基础使用方法
$(
'input'
).iCheck({
labelHover :
false
,
cursor :
true
,
checkboxClass :
'icheckbox_square-blue'
,
radioClass :
'iradio_square-blue'
,
increaseArea :
'20%'
});
//基础使用方法
$(
'input'
).iCheck({
labelHover :
false
,
cursor :
true
,
checkboxClass :
'icheckbox_square-blue'
,
radioClass :
'iradio_square-blue'
,
increaseArea :
'20%'
});
{
handle:
''
,
checkboxClass:
'icheckbox'
,
radioClass:
'iradio'
,
checkedClass:
'checked'
,
checkedCheckboxClass:
''
,
checkedRadioClass:
''
,
uncheckedClass:
''
,
uncheckedCheckboxClass:
''
,
uncheckedRadioClass:
''
,
disabledClass:
'disabled'
,
disabledCheckboxClass:
''
,
disabledRadioClass:
''
,
enabledClass:
''
,
enabledCheckboxClass:
''
,
enabledRadioClass:
''
,
hoverClass:
'hover'
,
focusClass:
'focus'
,
activeClass:
'active'
,
labelHover:
true
,
labelHoverClass:
'hover'
,
increaseArea:
''
,
cursor:
false
,
inheritClass:
false
,
inheritID:
false
,
insert:
''
}
$(
'input'
).on(
'ifChecked'
,
function
(event){
//ifCreated 事件应该在插件初始化之前绑定
alert(event.type +
' callback'
);
});
posted on 2017-06-26 09:34 judy_ma0605 阅读(1404) 评论(0) 编辑 收藏 举报