Question

第一个功能将div点击转换为自定义选中/未选中的切换。第二个函数将复选框更改转换为检查/取消选中事件（此工作正常）。

问题是当我使用第一个函数来检查/取消选中该框时，不会调用第三个函数。我是javascript的新手，谢谢。

 $(document).ready(function() {
/*
  Progressive enhancement.  If javascript is enabled we change the body class.  Which in turn hides the checkboxes with css.
*/
$('body').attr("class","js");

/*
  Add toggle switch after each checkbox.  If checked, then toggle the switch.
*/
 $('.checkbox').after(function(){
   if ($(this).is(":checked")) { 
     return "<a href='#' class='toggle checked' ref='"+$(this).attr("id")+"'></a>";

   }else{
     return "<a href='#' class='toggle' ref='"+$(this).attr("id")+"'></a>";

   }


 });

 /*
  When the toggle switch is clicked, check off / de-select the associated checkbox
 */
$('.toggle').click(function(e) {
   var checkboxID = $(this).attr("ref");
   var checkbox = $('#'+checkboxID);

   if (checkbox.is(":checked")) { 
     checkbox.removeAttr("checked");

   }else{
     checkbox.attr("checked","true");
   }
   $(this).toggleClass("checked");

   e.preventDefault();
});


});

$(document).ready(function(){

$(":checkbox").change(function(){

if ($(this).is(":checked")) {  $(el).layerSlider('start');
}else{ $(el).layerSlider('stop');}
});

 });

Answer 1

向动态内容添加事件（在本例中为动态锚元素）你将不得不使用现场或功能。

对于1.7之前的jquery版本，您必须使用Live功能。

$('.toggle').live("click", function (e) {   
        var checkboxID = $(this).attr("ref");
        var checkbox = $('#' + checkboxID);

        if (checkbox.is(":checked")) {
            checkbox.prop('checked', false);

        } else {
            checkbox.prop('checked', true);  //jQuery 1.6+
        }
        e.preventDefault();
    });

来自jQuery 1.7+ Live已被弃用，并且从1.9+ Live被删除。所以，如果你使用的是jQuery 1.9+，请使用On。

$('.toggle').on("click",function (e) {   
        var checkboxID = $(this).attr("ref");
        var checkbox = $('#' + checkboxID);

        if (checkbox.is(":checked")) {
            checkbox.prop('checked',false);

        } else {
            checkbox.prop('checked', true);  //jQuery 1.6+
        }
        e.preventDefault();
    });

并使用prop功能选中/取消选中复选框。（从jQuery 1.6添加了Prop）

Answer 2

您需要在复选框上触发更改事件，而不是单击

为什么我的复选框更改事件没有被触发？

2 个答案: