如果未禁用，则 Jquery 全选 [英] Jquery select all if not disabled

问题描述

我正在使用以下脚本选择具有给定类的所有复选框.

I am using the following script to select all checkboxes with a given class.

$(document).ready(function(){ // 1
    // 2
    $(':checkbox.selectall').on('click', function(){
        // 3
        $(':checkbox[class='+ $(this).data('checkbox-name') + ']').prop("checked", $(this).prop("checked"));
        $(':checkbox[class='+ $(this).data('checkbox-name') + ']').trigger("change");
    });

});

但是我遇到了一个问题，因为取消/全选复选框能够取消/选择被禁用的复选框.

However I'm having a problem as the de/select all checkbox is able to de/select checkboxes which are disabled.

我试过了

$(document).ready(function(){ // 1
    // 2
    $(':checkbox.selectall').on('click', function(){
        // 3
        $(':checkbox[class='+ $(this).data('checkbox-name') + !$(:disabled) + ']').prop("checked", $(this).prop("checked"));
        $(':checkbox[class='+ $(this).data('checkbox-name') + !$(:disabled) + ']').trigger("change");
    });

});

但它不起作用.我做了一个 jsfiddle 来展示这个问题 http://jsfiddle.net/e67Fv/

But it does not work. I have made a jsfiddle to showcase the problem http://jsfiddle.net/e67Fv/

推荐答案

嗯...有趣的尝试，但你不能在选择器中使用 jQuery 对象，因为选择器只是一个普通的字符串.

Hm... interresting attempt, but you can't use a jQuery object inside a selector, as the selector is just a plain string.

用于排除禁用元素的选择器将是 :not(:disabled)，因此您的代码应该是:

The selector for excluding the disabled elements would be :not(:disabled), so your code should be:

$(document).ready(function(){
  $(':checkbox.selectall').on('click', function(){
    $(':checkbox[class='+ $(this).data('checkbox-name') + ']:not(:disabled)').prop("checked", $(this).prop("checked"));
    $(':checkbox[class='+ $(this).data('checkbox-name') + ']:not(:disabled)').trigger("change");
  });
});

请注意，您可以链接调用，因此您不必选择项目两次:

Note that you can chain calls, so you don't have to select the items twice:

$(document).ready(function(){
  $(':checkbox.selectall').on('click', function(){
    $(':checkbox[class='+ $(this).data('checkbox-name') + ']:not(:disabled)').prop("checked", $(this).prop("checked")).trigger("change");
  });
});

这篇关于如果未禁用，则 Jquery 全选的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！