Question

我有一个下拉列表，我可以选择多个选项。如果我选择其中一个选项，我需要禁用其余选项。

例如：在下面的代码中，如果我选择All选项，我需要禁用其余选项。

<select id="searchRegion" name="searchRegion" multiple="multiple">
<option> Choose Region(s) </option>
<option value="all"> All </option>
<option value="East"> East </option>
<option value="North"> North </option>
<option value="West"> West </option>
<option value="South"> South </option>
</select>

image

Answer 1

尝试

＆＃13;

var $searchRegion = $('#searchRegion').change(function() {
  var isAll = $searchRegion.find('[value="all"]').is(':selected');
  if (isAll) {
    $searchRegion.val('all');
  }
  $searchRegion.find('option').not('[value="all"]').prop('disabled', isAll);
})

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<select id="searchRegion" name="searchRegion" multiple="multiple">
  <option>Choose Region(s)</option>
  <option value="all">All</option>
  <option value="East">East</option>
  <option value="North">North</option>
  <option value="West">West</option>
  <option value="South">South</option>
</select>

＆＃13;

Answer 2

请参阅http://jsfiddle.net/xn9rg0kd/

$("#searchRegion").on("change", function(){
    if ($(this).val()[0] == "All"){
     $("#searchRegion option:selected").siblings().attr('disabled', 'disabled');
    }
});

如果单击第一个选项，则禁用下拉列表中的其他选项

2 个答案: