0

如果已在任何其他选择元素中选择了某个选项,我将尝试禁用该选项,如果未选中则重新启用它。

当我预选选项时,此功能无法正常工作(selected="selected"),并且一次仅适用于所有选择元素中的一个选项。如何修改它以使用预选选项以及所有元素中的所有选项?

我在这里发布了一个没有任何预选选项的函数的小提琴:http: //jsfiddle.net/dZqEu/927/

JS

$('.rank_options').change(function() { 
    $('#priority1, #priority2, #priority3, #priority4, #priority5').not(this)
    .children('option[value=' + this.value + ']')
    .attr('disabled', true)
    .siblings().removeAttr('disabled');    
});

HTML

<tr >        
<td><select name=priority1 id="priority1" class="rank_options" >
    <option selected="selected" value="Test 1">Test 1</option> 
    <option value="Test 2">Test 2</option> 
    <option value="Test 3">Test 3</option> 
    <option value="Test 4">Test 4</option> 
    <option value="Test 5">Test 5</option></select> 
</td>
<td ><select name=priority2 id="priority2" class="rank_options" >
    <option value="Test 1">Test 1</option> 
    <option selected="selected" value="Test 2">Test 2</option> 
    <option value="Test 3">Test 3</option> 
    <option value="Test 4">Test 4</option> 
    <option value="Test 5">Test 5</option></select>  
</td>
<td><select name=priority3 id="priority3" class="rank_options" >
    <option value="Test 1">Test 1</option> 
    <option value="Test 2">Test 2</option> 
    <option selected="selected" value="Test 3">Test 3</option> 
    <option value="Test 4">Test 4</option> 
    <option value="Test 5">Test 5</option></select> 
</td>
<td><select name=priority4 id="priority4" class="rank_options" >
    <option value="Test 1">Test 1</option> 
    <option value="Test 2">Test 2</option> 
    <option value="Test 3">Test 3</option> 
    <option selected="selected" value="Test 4">Test 4</option> 
    <option value="Test 5">Test 5</option></select>                          
</td>
<td><select name=priority5 id="priority5" class="rank_options" >
    <option value="Test 1">Test 1</option> 
    <option value="Test 2">Test 2</option> 
    <option value="Test 3">Test 3</option> 
    <option value="Test 4">Test 4</option> 
    <option selected="selected" value="Test 5">Test 5</option></select> 
</td>       
</tr>
4

1 回答 1

0

像这样的东西?

$(document).ready(function(){
$('select option[value="Test 1"]').attr('disabled',true);
});
$('.rank_options').change(function () {
  $('#priority1, #priority2, #priority3, #priority4, #priority5').
  find('option:selected').each(function(){
   $("#priority1, #priority2, #priority3, #priority4, #priority5").find("option[value="+this.value+"]").attr('disabled', true);
   });
});

演示视图

于 2013-03-10T20:42:15.003 回答