javascript - JS/JQuery - 选中所有复选框

Question

我有一个照片库。每张照片下方都有一个复选框，其 ID 包含前缀“checkbox_”，后跟照片 ID。

<input type="checkbox" id="checkbox_<%=photoID%>" name="photos">

当我选中“selectAll”复选框时，如下所示:

<input type="checkbox" id="toggleAll" name="toggleAll" onclick="toggleAll()">

我想选中/取消选中所有名为“照片”的复选框，因此我有这个应该执行此操作的函数...但它没有:

function toggleAll() {
if (document.getElementById('toggleAll').checked == true)
        {
        $('.photoBlob').animate({backgroundColor: 'rgba(0,102,204,0.5)'}, 500);
        $('.photoBlob').animate({backgroundColor: 'rgba(204,204,204,1)'}, 1500);
        document.getElementByName('photos').checked = true;
        }
else
        {
        $('.photoBlob').animate({backgroundColor: 'rgba(0,0,0,0)'}, 1000);
        document.getElementByName('photos').checked = false;
        }
}

该函数的其余部分工作正常，当调用toggleALL() 函数时，它会为包含的DIV (#photoBlob) 的背景颜色设置动画。但是，我真的无法检查所有复选框，而且我已经尝试了很多不同的变体!

有人能看出我做错了什么吗？问题出在这两行:

document.getElementByName('photos').checked = true;
document.getElementByName('photos').checked = false;

非常感谢您收到的任何建议...

Answer 1

你可以这样做，不要对多个复选框使用相同的名称，因为名称必须是唯一的。而不是使用类。

<input type="checkbox" id="checkbox_<%=photoID%>" class="photos">

jquery，

$('#toggleAll').click(function(){
    var checked =$(this).attr('checked');
    $('.photos').attr('checked', checked);

}