bootstrap icheck插件

最新推荐文章于 2023-01-12 13:44:55 发布

原创最新推荐文章于 2023-01-12 13:44:55 发布 · 460 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#bootstrap #插件

本文介绍如何使用jQuery插件iCheck来实现单选按钮的状态切换，包括取消选择已选中的选项及从未选中状态变为选中状态。此外还展示了如何通过监听全选按钮来实现表格中所有复选框的全选或全不选操作。

//判断单选是否有是选中的,如果选中点击就不选中，如果不选中，点击就选中

$("input[type='radio']").on('ifClicked', function (event) {
if ($(this).attr("checked",true)) {
$(this).iCheck('uncheck');
} else {
$(this).iCheck('check');
}
});

或者

$(".ifcheck_radio input[type='radio']").on('ifClicked', function (event) {
if($(this).closest(".iradio_square-blue").attr("class").indexOf("checked")>-1){
$(this).closest(".iradio_square-blue").removeClass("checked");
}else{
$(this).closest(".iradio_square-blue").addClass("checked");
}
});

//表单的全选/全不选

$('.list-content table tr:first-child th:first-child input').on('ifChecked ifUnchecked', function(event) {
if (event.type == 'ifChecked') {
$(".list-content table tr td input").iCheck('check');
} else {
$(".list-content table tr td input").iCheck('uncheck');
}
})