只在第一次尝试检查复选框,javascript / jquery错误?

时间:2014-03-28 16:29:58

标签: javascript jquery

好的,所以我需要能够点击.modal-interest中的任何元素,并在它被点击时检查子元素复选框。

目前,它似乎适用于第一次点击 - 但是对于每次后续点击,即使代码应该检查复选框,它也什么都不做。

$('.modal-interest strong').click(function (e) {

 input = $(this).closest('.modal-interest').find('input');

 if (input.prop('checked')) {
     input.attr('checked', false).change();
 } else {
     input.attr('checked', true).change();
 }
});

可以在以下小提琴中看到我问题的准确表示:

http://jsfiddle.net/c3p5m/

坚持这一点,并感谢任何帮助!

4 个答案:

答案 0 :(得分:1)

您应该使用.prop()代替:

DEMO jsFiddle

 $('.modal-interest strong').click(function (e) {

     input = $(this).closest('.modal-interest').find('input');

     if (input.prop('checked')) {
         input.prop('checked', false).change();
         $('h1').html('untick it');
     } else {
         input.prop('checked', true).change();
         $('h1').html('tick it');
     }
 });

现在确实,您的代码应该是这样的:

$('.modal-interest strong').click(function (e) {
    var input = $(this).closest('.modal-interest').find('input')[0];
    input.checked = !input.checked;
    $(input).change();
});
$('.modal-interest input[type=checkbox]').on('change', function () {
    $('h1').html(this.checked ? 'tick it' : 'untick it');
});

DEMO

答案 1 :(得分:1)

使用.prop()设置checked/Unchecked

input.prop('checked', false).change();

Fiddle Demo

答案 2 :(得分:0)

应该使用prop方法。

input.prop('checked', false).change();

答案 3 :(得分:0)

试试这段代码:

 $('.modal-interest').click(function () {

     var input = $(this).find('input');

     if (input.prop('checked')) {
         input.prop('checked', false).change();
         $('h1').html('untick it');
     } else {
         input.prop('checked', true).change();
         $('h1').html('tick it');
     }
});