1

我试图在选择单选按钮时激活一组选择下拉菜单,并在选择另一个按钮时停用。

jQuery:

$(':radio[name!="hours"]').change(function() {
  if ($(this).filter(':checked').val() == "open") {
    $(this).nextUntil("input","select").attr("disabled", false);
  } else {
    $(this).nextUntil("input","select").attr("disabled", true);
  }
});

HTML:

<form id="providerForm">
  <p><input type="radio" name="hours" value="no" checked="true"> There are no hours at this location</p>
  <p><input type="radio" name="hours" value="yes"> Enter the hours below</p>
  <span id="hoursList">
    <p><label for="monday">Monday: </label><span class="radios"><input type="radio" name="monday" value="closed"/> Closed</span>
    <span class="radios"><input type="radio" name="monday" value="open"/> Open <select name="monStart" id="monStart" disabled></select> to <select name="monEnd" id="monEnd" disabled></select></span></p>
    <p><label for="tuesday">Tuesday: </label><span class="radios"><input type="radio" name="tuesday" id="tueClosed" value="closed"/> Closed</span>
    <span class="radios"><input type="radio" name="tuesday" value="open"/> Open <select name="tueStart" id="tueStart" disabled></select> to <select name="tueEnd" id="tueEnd" disabled></select></span></p>
  </span>
  <input type="submit" id="loginButton" name="submit" value="Add Hours" />
</form>

小提琴在这里:http: //jsfiddle.net/BN6JD/

单击“打开”时启用选择框 - 这很棒。但是,它们不会在单击“关闭”后再次禁用。我哪里错了?

4

1 回答 1

1

您正在过滤单个单选输入(即checked)而不是单选组,并且nextUntill仅选择不适用于当前标记的所选元素的下一个同级。还应使用修改属性prop方法而不是attr. 试试这个:

$('input[type=radio][name!="hours"]').change(function() {
    $(this).closest('p') // select the closest parent `p` element
           .find('select') // find `select` elements
           .prop("disabled", this.value === 'closed'); // disable/enable the selects  
});

http://jsfiddle.net/6ELcA/

于 2013-07-11T22:11:03.093 回答