logo标签列表

iCheck 检查复选框是否被选中

javascriptjquerycheckboxicheck
60

我正在使用iCheck插件来自定义复选框。当一个或多个复选框被选中时，我需要显示特定的文本，并在没有选中任何复选框时隐藏该文本。

我目前的代码在第一次单击时显示文本，但除非我再单击2次，否则不会隐藏它。 我有多个复选框，希望在其中一个被选中时显示文本，否则隐藏文本。 有人有什么想法吗？该插件具有：

ifChecked
ifChanged
ifClicked
ifUnchecked
ifToggled
ifDisabled
ifEnabled.......

回调函数...这是插件函数

$('input').iCheck({ 
checkboxClass: 'icheckbox_square-blue',
radioClass: 'iradio_square-blue',
increaseArea: '20%' // optional
});

这是我尝试的内容...

$('input').on('ifChecked', function(event){
$(".hide").toggle();
});

HTML

<input type="checkbox">
<div class"hide" style="display:none">Hi there</div>
1
这可能会给你一些方向 :) https://dev59.com/RXE85IYBdhLWcg3wr1ke P.S. 帖子有点混乱，我将粘贴 is(':checked') 标志，以便您可以相应地使用它。在 jsfiddle 上分享代码，我应该能够帮助您。 - Tats_innit
15个回答
64

对于那些遇到困难的人：

const value = $('SELECTOR').iCheck('update')[0].checked;

这直接返回true或false作为boolean。

这里需要传入什么作为SELECTOR的位置？ - Jay Rathod
这是一个 jQuery 选择器的示例。如果您想选择一个类，您需要使用 .myClass，如果您想选择一个 ID，则应使用 #myID。 - Sercan Ozdemir
1
谢谢，使用jQuery检查输入时这种方法也有效！ - Bassem Shahin
1
对于我来说，返回未定义。TypeError: 无法读取未定义的属性“checked”。 - user9632001
1
@SercanOzdemir 你太棒了！(y) - Nithee
34

您可以通过以下方式获取复选框的值和状态：

$('.i-checks').on('ifChanged', function(event) {
    alert('checked = ' + event.target.checked);
    alert('value = ' + event.target.value);
});
21

请看这个：

var checked = $(".myCheckbox").parent('[class*="icheckbox"]').hasClass("checked");

if(checked) {
  //do stuff
}
3
这个方法效果不好。 我正在收集许多 iCheck 复选框的“checked”类状态，但是设置“check”类的代码比读取该类的特定代码慢。 因此这种方法存在时间问题，应该避免使用。 - PIDZB
15

所有回调函数的文档都在这里：http://fronteed.com/iCheck/#usage

$('input').iCheck('check'); — change input's state to checked
$('input').iCheck('uncheck'); — remove checked state
$('input').iCheck('toggle'); — toggle checked state
$('input').iCheck('disable'); — change input's state to disabled
$('input').iCheck('enable'); — remove disabled state
$('input').iCheck('indeterminate'); — change input's state to indeterminate
$('input').iCheck('determinate'); — remove indeterminate state
$('input').iCheck('update'); — apply input changes, which were done outside the plugin
$('input').iCheck('destroy'); — remove all traces of iCheck
13
30
这个问题很清楚，是如何确定复选框是否被选中，而不是引发了什么类型的事件！！这个回答怎么跟问题扯上关系了？ - DATEx2
10

要知道iCheck复选框是否被选中

var isChecked = $("#myicheckboxid").prop("checked");
7
我是一个有用的助手，可以为您翻译文本。
我写了一些简单的东西：
当您将 icheck 初始化为以下内容时：
$('input').iCheck({
    checkboxClass: 'icheckbox_square-blue',
    radioClass: 'iradio_square-blue',
    increaseArea: '20%' // optional
});

在此下方添加以下代码：

$('input').on('ifChecked', function (event){
    $(this).closest("input").attr('checked', true);          
});
$('input').on('ifUnchecked', function (event) {
    $(this).closest("input").attr('checked', false);
});

在这之后，您可以轻松找到原来的复选框状态。我为在gridView中使用icheck编写了此代码，并通过C#从服务器端访问其状态。
只需按其id查找checkBox即可。
2
这正是我一直在 iCheck 中缺少的东西！谢谢。 - mtness
1
我会考虑指定选择器为：input[type=checkbox]，input[type=radio]。 - mtness
5
请使用以下代码进行iCheck设置：
$('.i-checks').iCheck({
    checkboxClass: 'icheckbox_square-green',
    radioClass: 'iradio_square-green',
}).on('ifChanged', function(e) {
    // Get the field name
    var isChecked = e.currentTarget.checked;

    if (isChecked == true) {

    }
});
3

呼叫

element.iCheck('update');

获取元素的更新标记。
3
使用以下代码来检查iCheck是否已勾选，只需使用单个方法即可。
$('Selector').on('ifChanged', function(event){

    //Check if checkbox is checked or not
    var checkboxChecked = $(this).is(':checked');

    if(checkboxChecked) {
        alert("checked");
    }else{
        alert("un-checked");
    }
});
网页内容由stack overflow 提供, 点击上面的
可以查看英文原文，
原文链接