切换不适用于所有选项卡和内联文本对齐

Question

我试图弄清楚为什么这行代码不会在发送的消息选项卡中执行。它在收件箱内工作正常，但没有发送。我还试图弄清楚为什么当我将文本对齐中心样式应用于内联时，正文复选框没有居中。

http://jsfiddle.net/Ytx9D/3/

$('#selectall').toggle(
    function() {
        $('.table .messages').prop('checked', true);
    },
    function() {
        $('.table .messages').prop('checked', false);
    }
);

更新：http://jsfiddle.net/Ytx9D/4/

Answer 1

您有多个带有id="selectall"的DOM节点，因此jQuery仅将事件绑定到第一个节点。

您可以通过点击“收件箱信息”中的全选按钮，然后切换到“已发送信息”来证明这一点，您将看到它们都已经过检查。

解决方案是命名这些并将它们更改为类。

<input type="checkbox" name="messages" class="selectall hidden" />

然后你的jQuery看起来像这样：

$('.selectall').toggle(
    function() {
        $(this).closest('.table').find('.messages').prop('checked', true);
    },
    function() {
        $(this).closest('.table').find('.messages').prop('checked', false);
    }
);