php/javascript在多个列表框中没有重复的数据

Question

我想知道是否有可能在php/javascript中防止在多个选择框中出现重复数据。我有6个选择框，用户可以选择1到36之间的数字。

我真正想要的是，当用户在第一个选择框中选取任何数字（例如12）时，该数字为12韩元不会出现在第二个选择框中。我在互联网上搜索了所有内容，没有任何线索。

Answer 1

您可以检查一下这些功能如何工作，使自己的解决方案：

• 绑定一个事件处理JavaScript事件，或者触发该事件的“变化” - >jQuery .change()
• 获取的价值属性为匹配元素集合中的第一个元素 - >jQuery .prop()

这种方式与其他答案略有不同，因为一个删除该选项，另一个将其禁用。

jQuery的一部分（不要忘了添加的jQuery在页面的头部）

$(document).ready(function() { 
    $(".connSelect").change(function() { 

     var selVAL = $(this).val(); // will handle the value of selected item 

     $("select option:selected").each(function() { // when value is selected 
      $("option[value=" + selVAL + "]").prop('disabled', true); // disable on other 'select' 
     }); 
    }); 
}); 

HTML部分

<select name="select-1" id="select-1" class="connSelect"> 
    <option value="">-- pick one --</option> 
    <option value="1">-- 1 --</option> 
    <option value="2">-- 2 --</option> 
    <option value="3">-- 3 --</option> 
    <option value="4">-- 4 --</option> 
    <option value="5">-- 5 --</option> 
</select> 

<select name="select-2" id="select-2" class="connSelect"> 
    <option value="">-- pick one --</option> 
    <option value="1">-- 1 --</option> 
    <option value="2">-- 2 --</option> 
    <option value="3">-- 3 --</option> 
    <option value="4">-- 4 --</option> 
    <option value="5">-- 5 --</option> 
</select> 

<select name="select-3" id="select-3" class="connSelect"> 
    <option value="">-- pick one --</option> 
    <option value="1">-- 1 --</option> 
    <option value="2">-- 2 --</option> 
    <option value="3">-- 3 --</option> 
    <option value="4">-- 4 --</option> 
    <option value="5">-- 5 --</option> 
</select> 

这里有一个FIDDLE看它是如何工作的

注意：这只是一个操作示例，它不会对值执行任何验证，也不会在禁用时再次启用值