Question

民间，我有手风琴面板，其标题中包含一个复选框：

 <div id="accordion">
   <h3><a href="#"><input type='checkbox' id='chkbox'/>First header</a></h3>
   <div>First content</div>
    <h3><a href="#">Second header</a></h3>
   <div>Second content</div>
</div>

现在当我点击复选框时，jquery使用event.preventDefault来抑制click事件。因此我无法更改复选框状态。我尝试了以下技巧，但没有运气：

$("#accordion").accordion();

$('#chkbox').live('click',function(){
   var checkbox = $(this).find(':checkbox');
   checkbox.attr('checked', !checkbox.attr('checked'));

});

请帮忙!! 看到代码http://jsfiddle.net/teBfb/1/ 感谢

Answer 1

你在做什么

.attr('checked', !$checkbox.attr('checked'));

应该有效。这意味着你的选择器被破坏了。你在变量名中使用$符号的原因是什么？它可能会混淆jQuery。

Answer 2

您可以使用stopPropagation，因此您的复选框点击事件不会上传。

$("#accordion h3 input").click(function(e) { 
    e.stopPropagation(); 
});

http://jsfiddle.net/teBfb/6/

Answer 3

   $(function () {
        $("#accordion").accordion({
            collapsible: true,


        });
    });



    $("#accordion h3 input").click(function (e) {

        var checkedStatus = $(this).prop('checked');
        e.stopPropagation();
         if (checkedStatus) {


           $("#accordion div div").slideUp();

            $(this).parent().next().slideDown();
         }
        else {


             $("#accordion div div").slideDown();

             $(this).parent().next().slideUp();

       }


    });

试试这个

点击事件被Jquery Accordion压制

3 个答案: