从输入/复选框捕获事件

时间:2014-06-23 23:17:09

标签: javascript jquery icheck

我正在使用ICheck来自定义我的复选框。我无法注册他们的活动。我一直在使用this作为可触发事件的参考。

我的复选框如下,其中名称是动态生成的:

<input name=<?php echo getname();?> type="checkbox" />

这是我处理事件的jquery(仅用于测试):

$('input').on('IfChecked', function(event){
    alert(event.type + ' callback');
});
$('input').on('Unchecked', function(event){
    alert(event.type + ' callback');
});

浏览器上的结果复选框如下:

<div class="icheckbox_minimal" aria-checked="false" aria-disabled="false" style="position: relative;">
<input name="QzpceGFtcHBcaHRkb2NzXG1ldHRhXHVzZXJzXGpvaG5kb2VcTWFpbGRpclxuZXdcMTM5ODE3Mzg4Mi5IOTA1NDI4UDEyMjIxLmRlZGk0NC5jcHQyLmhvc3QtaC5uZXQ1M2E3NGNkYzhiMDJk" type="checkbox" style="position: absolute; opacity: 0;">
<ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins>
</div>

然而,当我选中复选框时 - 没有任何反应。该复选框没有响应。我对javascript比较新,可能是什么问题?

2 个答案:

答案 0 :(得分:2)

以下是您的标记和代码应该如何使插件工作。 iCheck必须先进行初始化才能使用。

.......
<script src="path-to/jquery"></script>
<script src="path-to/icheck.js"></script>
<script>
    $(function() {
        $('input').iCheck(); //minimum initialization

        $('input').on('ifChecked', function(event){
            alert(event.type + ' callback');
        });
        $('input').on('ifUnchecked', function(event){
            alert(event.type + ' callback');
        });
    });
</script>
</head>
<body>
<div class="icheckbox_minimal" aria-checked="false" aria-disabled="false" style="position: relative;">
<input name="QzpceGFtcHBcaHRkb2NzXG1ldHRhXHVzZXJzXGpvaG5kb2VcTWFpbGRpclxuZXdcMTM5ODE3Mzg4Mi5IOTA1NDI4UDEyMjIxLmRlZGk0NC5jcHQyLmhvc3QtaC5uZXQ1M2E3NGNkYzhiMDJk" type="checkbox" style="position: absolute; opacity: 0;">
<ins class="iCheck-helper" style="position: absolute; top: 0%; left: 0%; display: block; width: 100%; height: 100%; margin: 0px; padding: 0px; border: 0px; opacity: 0; background: rgb(255, 255, 255);"></ins>
</div>
.....

答案 1 :(得分:0)

除非您自己将这些事件定义为自定义事件...未选中且IfChecked事件不存在。 - &gt; 抱歉,我不知道ICheck的内容

无论如何,我会这样做:

$('input').on('change', function(event){
    var $myCheckbox = $(this);
    if($myCheckbox.prop('checked')){
        alert('my checkbox is checked!');
    } else {
        // not checked
    }
});