2

第一个函数将 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');}
});

 });
4

2 回答 2

1

要将事件添加到动态内容（在本例中为动态锚元素），您必须使用 live 或 on 功能。

对于 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();
    });

并且还使用道具功能来检查/取消选中复选框。（道具是从 jQuery 1.6 添加的）

于 2013-04-13T11:40:57.210 回答
-2

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

于 2013-04-13T10:50:28.293 回答