Question

所以我有这个脚本，其中有多个复选框，我有一个脚本，当你选中一个复选框时会显示其他按钮，但该脚本仅适用于页面上的第一个复选框，而所有复选框都具有相同的ID。

其中一个复选框：

<input type="checkbox" id="checkstate" name="diritems[]" value=".snap" onclick="javascript:Toggle(this);">

剧本：

$(document).ready(function(){
$('#checkstate').change(function(){
    if ($('#checkstate').is(':checked'))
        $('.addopt').fadeIn('Fast', 'linear');
    else
        $('.addopt').fadeOut('Fast', 'linear');

});});

所以这只会在第一个复选框上有效，第一个是id =＆＃34; checkstate＆＃34;在页面上找到，任何其他复选框都不会做任何事情。

（P.S.togglethis是一个单独的功能，它确实有效）

Answer 1

页面中的ID应该是唯一的。当您尝试查找具有相同ID的多个元素时，您将只获得第一个元素。

使用类来代替复选框：

<input type="checkbox" class="checkstate" name="diritems[]" value=".snap" onclick="javascript:Toggle(this);">

现在你可以找到所有这些：

$('.checkstate').change(function(){
  ...

Answer 2

您需要使用一个类来定位它们（或其他选择器可以应用于多个元素），然后使用this关键字来定位实际的单击元素。

$(document).ready(function() {
    $('.checkstate').change(function() {
        if (this.checked) {
            $('.addopt').fadeIn('Fast', 'linear');
        } else {
            $('.addopt').fadeOut('Fast', 'linear');
        }

    });
});

jQuery toggle div仅适用于第一个复选框

2 个答案: