iCheck jQuery 阻止自定义脚本

Question

我用"iCheck jQuery"修改了checkbox的样式。但是当我添加 iCheck 脚本时 - 我的 onlick 方法停止工作。为什么会这样？

<input id="my_cb"  type="checkbox" value="yes_n" onclick="hide_row_metod()"/>
    <script>
    $(document).ready(function(){
      $('#my_cb').iCheck({
        checkboxClass: 'icheckbox_square-blue',
        radioClass: 'iradio_square-blue',
        increaseArea: '20%' // optional
      });
    });    
    </script>

我的脚本：

<script>
   function hide_row_metod() {
     if(document.getElementById('my_cb').checked){
        document.getElementById('row1').style.display = "none";
     }else{
            document.getElementById('row1').style.display = "inline";
          }
     }
</script>

Answer 1

它可能被 iCheck 脚本覆盖。尝试仅使用 jQuery:

$('#my_cb').on('click', function() {
    $('#row1').css('display', this.checked ? 'none' : 'inline');
});

Answer 2

iCheck registers custom events you can listen for. I put up a working example on jsbin，主要区别是：

$("#my_cb").on("ifChanged", hide_row_metod);

有两个事件：ifChecked and ifUnchecked。如果您想捕获复选框的所有更改，您需要同时监听两者或只监听 ifChanged。这将用于切换行，因为您正在 hide_row_metod.

中测试 checked

在我的示例中，我使用了块元素 div#row1，因此它在选中和取消选中后呈现不同 (inline)。

此外：您的方法名称中有错字（缺少 h）。

Answer 3

我知道有人问这个问题已经有一段时间了。我制作了一个脚本来捕获每个单选/复选框的 onclick 属性并将其附加到其相应的 iCheck / iRadio。请记住在应用 iCheck 后运行它。在 iCheck 实施后设置超时或运行：

$("[class*='icheckbox'],[class*='iradio']").each(function(){
  $(this).find("ins").attr("onclick", $(this).find("input").attr("onclick"));
});

iCheck jQuery 阻止自定义脚本

iCheck jQuery blocks custom script

jquery

onclick

icheck