5

所以我有一个问题。我正在尝试切换复选框以便向父级添加一些 CSS<tr>

这是我到目前为止所拥有的

 $('input[type=checkbox]').toggle(function(){

    $(this).parents('tr').addClass('selectCheckBox', 970);
},
function(){

    $(this).parents('tr').removeClass('selectCheckBox', 970);
});

但是，这样做的结果是<tr>确实收到了selectCheckBox但复选框没有被选中。所以我尝试了以下方法：

 $('input[type=checkbox]').toggle(function(){
    $(this).attr('checked',true);
    $(this).parents('tr').addClass('selectCheckBox', 970);
},
function(){
    $(this).attr('checked',false);
    $(this).parents('tr').removeClass('selectCheckBox', 970);
});

再一次，没有运气。

我相信这与复选框 id 的外观有关。

<input type="checkbox" name="select[]" id="select[]">

[]然后我尝试通过使用\\[\\]过去使用的方式来逃避，但没有运气。

有没有办法进行checkbox检查？

4

3 回答 3

1

试穿change活动。另外，我认为toggleevent 已被弃用并且addClass不采用第二个参数（除非您使用的是 jQuery UI）。

$('input[type=checkbox]').change(function() {
  $(this).parents('tr').toggleClass('selectCheckBox', $(this).is(':checked'));
});
于 2012-12-19T00:54:05.607 回答
1

可能有一种方法可以进一步优化：

$('input[type=checkbox]').on('click', function() {
    var $this = $(this);
    if ($this.is(':checked')) {
        $this.closest('tr').addClass('selectCheckbox');
    } else {
        $this.closest('tr').removeClass('selectCheckbox');
    }
});

​JsFiddle

于 2012-12-19T00:56:14.553 回答
0

我想到了。我需要使用 toggleClass 以及其他 jQuery UI 参数来获得所需的效果。

$('input[type=checkbox]').click(function(){
    $(this).parents('tr').toggleClass('selectCheckBox',  1000, "easeOutSine" );
});

// Here are the parameteres below
    .toggleClass( className [, switch ] [, duration ] [, easing ] [, complete ] )
于 2012-12-19T01:34:31.927 回答