jQuery 从另一个更改操作更改操作

Question

我有下一个代码:

js:

    $('[id^="check-"]').change(function(){
        var new_id = this.id.replace(/check/, 'new'),
            real_id = this.id.replace(/check/, 'real');
        if ($(this).is(':checked')) {
            $('#'+real_id).val($('#'+new_id).text());
        } else {
            $('#'+real_id).val(0);
        }
    });

html:

<tr>
  <td><span id="new-1">2</span></td>
  <td><input type="text" name="real-1" id="real-1" value="0"></td>
  <td><input type="checkbox" class="card" id="check-1"></td>
</tr>
<tr>
  <td><span id="new-2">7</span></td>
  <td><input type="text" name="real-2" id="real-2" value="0"></td>
  <td><input type="checkbox" class="card" id="check-2"></td>
</tr>
<tr>
  <td><span id="new-3">4</span></td>
  <td><input type="text" name="real-3" id="real-3" value="0"></td>
  <td><input type="checkbox" class="card" id="check-3"></td>
</tr>

主要思想:当您点击相关的check-*时，将new-*中的文本放入real-*收件箱中> 复选框。

现在我想添加另一个复选框，以便对所有元素批量执行此操作。 我试过了:

    $('#main-checkbox').change(function(){
        if ($(this).is(':checked')) {
            $('.card').attr('checked', true);
        } else {
            $('.card').attr('checked', false);
        }

    });

但是它不起作用。为什么？ 如何为所有这些结帐启动 change 操作。

谢谢。

Answer 1

通过 JavaScript 更改字段值(包括选中状态)不会触发更改事件，但您可以显式调用 .change() 方法。您的函数也可以简化 - 您实际上不需要 if/else 结构:

$('#main-checkbox').change(function(){
    $('.card').attr('checked', this.checked).change();
});

演示:http://jsfiddle.net/4qs4d/

请注意，$(this).is(':checked') 只是表示 this.checked 的一种缓慢方式。另外，如果您使用的是 jQuery 1.6 或更高版本，您应该使用 .prop() method而不是 .attr()。