的JavaScript - 检查多重选择重复选项

这个问题是基于THIS QUESTION 的JavaScript - 检查多重选择重复选项

当被挑选出来的选择框选择一个选项，我想重新填充剩下的，不说的选择，而是有一个简单的方法来循环所有这些选择项目，以确保相同的选项没有被选择两次？

谢谢。

Person Number 1 
<select name="person1"> 
<option value="null">Please Select an option</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 

Person Number 2 
<select name="person2"> 
<option value="null">Please Select an option</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 

Person Number 3 
<select name="person3"> 
<option value="null">Please Select an option</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select>

基本概况： JavaScript的循环，以确保没有任何的选项已经被选中了两次？

来源

2013-10-03 BigDistance

jQuery为你选择一个选项还是你需要纯JS？ – j08691

@ j08691平原JS不幸 – BigDistance

<!DOCTYPE html> 
<html> 
<head> 
<script> 
function doAction(el) { 

    for (var i = 0; i < document.getElementById('person2').length; i++) { 
     var v = (i != el.selectedIndex ? '' : 'disabled'); 

     document.getElementById('person2')[i].disabled = v; 
     if (document.getElementById('person2').selectedIndex == el.selectedIndex) 
      document.getElementById('person2').selectedIndex = 0; 

     document.getElementById('person3')[i].disabled = v; 
     if (document.getElementById('person3').selectedIndex == el.selectedIndex) 
      document.getElementById('person3').selectedIndex = 0; 
    } 
} 
</script> 
</head> 
<body> 

Person Number 1 
<select id="person1" onchange="doAction(this)" > 
<option value="null">Please Select an option</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<br/> 
Person Number 2 
<select id="person2"> 
<option value="null">Please Select an option</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 
<br/> 
Person Number 3 
<select id="person3"> 
<option value="null">Please Select an option</option> 
<option value="1">1</option> 
<option value="2">2</option> 
<option value="3">3</option> 
</select> 

</body> 
</html>

来源

2013-10-03 16:22:41

如果我为人＃1做了一个部分，然后改变主意，会发生什么？ – j08691

在其他选择你不能选择人＃1，复制并粘贴在这里的HTML：http://www.w3schools.com/js/tryit.asp?filename=tryjs_events并尝试通过你自己 –

我会把它一种不同的方式。如果我从第一个选择中选择＃2，我可以看到它从其他选择中被禁用。精细。但是如果我改变主意并从第一次选择中选择＃3，现在＃3和＃2被禁用。 – j08691

如果使用

var x = document.getElementByName('person1').value; 
var y = document.getElementByName('person2').value; 
var z = document.getElementByName('person3').value;

你可以得到的值。然后，你有3项，以比较所有的人，你只需要做3个检查：

if(x == y || x == z || y == z){ 
    ... 
}

或者你可以扔掉所有的值到一个数组，然后拼接的第一次出现，然后检查它是否再次发生。

//get all selects 
var selects = document.getElementsByTagName('select'); 
var setOfPeople = []; 
for(i in selects){ 
    setOfPeople[i] = selects[i].name; 
} 
var selections = []; 
//put everything in an array 
for(i in setOfPeople){ 
    selections[i] = document.getElementByName(setOfPeople[i]).value; 
} 
for(i in setOfPeople){ 
    var val = document.getElementByName(setOfPeople[i]).value; 

    //make sure the element is in the selection array 
    if(selections.indexOf(val) != -1){ 
     //rip out first occurrence 
     selections.splice(selections.indexOf(val), 1); 
    } 

    //check for another occurrence 
    if(selections.indexOf(val) != -1){ 
     ... 
    } 
}

来源

2013-10-03 16:53:42 mduleone

一旦所有的选择都在一个数组中，你也可以只拼出数组的第一个元素，并寻找另一个事件，而不是再次循环setOfPeople，但我不喜欢修改我的数组循环，所以我没有这样做。 – mduleone

这是一个很好的方法，我只需要在传递数量的人后即时创建数组元素？ – BigDistance

我会遍历所有'

的JavaScript - 检查多重选择重复选项

回答