使用javascript / jquery禁用一组带复选框的选择元素

Question

我有一组或多组选择元素。我需要一次禁用一个，但都被禁用。我正在使用复选框来激活禁用操作。我正在使用javascript / jquery。

$(document).ready(function(){
  $('#hour-check').change(function() {
    $('select').prop('disabled', this.checked);
  });
});

JSFiddle LINK

Answer 1

您为每个复选框使用相同的ID。这些应该是唯一的，或者最好是使用一个类。

您还应该将表包装在包含的类中，以便更轻松地遍历DOM。

<div class="table-container">
    <p>
        <input type='checkbox' class="hour-check"> 24hr
    </p>
...

完成此操作后，您可以使用以下内容禁用相应的选择：

$('.hour-check').change(function() {
    $(this).parents('.table-container').find('select').prop('disabled', this.checked)
});

请参阅https://jsfiddle.net/d58euhas/