Javascript针对多个元素

Question

I have the following JS:

  function init_selectAllFull(){
        $('#select-all-perms input, #user_full_access_to_all_shows').click(function() {
            var checked = $(this).is(':checked');
            $('#show-permissions-list').find('input[type=checkbox].full_access').each(function() {
            if (checked) {
                $(this).prop("checked", true);
            } else {
                $(this).removeAttr("checked");
                $(".internal.external[value='none']").prop('checked', true);
                $(".external[value='none']").prop('checked', true);
                $(".internal[value='none']").prop('checked', true);
                $(".external.internal[value='none']").prop('checked', true);

            }
                $(this).trigger("change");
            });
        });
  }

It checks a bunch of radio fields when user unchecks a field. This works but I don't like the following code, there's too much repetition going on.

$(".internal.external[value='none']").prop('checked', true);
$(".external[value='none']").prop('checked', true);
$(".internal[value='none']").prop('checked', true);
$(".external.internal[value='none']").prop('checked', true);

Is there a cleaner way to target multiple classes? any help would be greatly appreciated. thank you so much!

Answer 1

You can chain selectors in jquery like so:

$(".internal.external[value='none'], .external[value='none'], .internal[value='none'], .external.internal[value='none']").prop("checked", true);

Think of it like in a CSS file, where you can style multiple classes or elements by separating the selectors of a style block with commas:

.row1, .row2 {
    border: 1px solid blue;
}