多个select下拉框,当选中当前的一项时,其他下拉选都不能选择同样的选项(下拉选的值不能相同)

发现了两个解决方法,一个是自己写的比较鸡肋

//选中的选项不能够重复(重复的选项隐藏) $(document).ready(function(){ $('#selectOption select').change(function(){ var oldValue=https://www.it610.com/article/$(this).attr('old'); var currentValue=https://www.it610.com/article/$(this).val(); if(oldValue){ $('select option[value='https://www.it610.com/article/+oldValue+']').show(); } $('select option[value='https://www.it610.com/article/+currentValue+']').hide(); //不打印选项不隐藏 $('#option1').show() $('#option2').show() $('#option3').show() $(this).attr('old',currentValue); }); });

当时遇到了一个问题,有一个选项不需要隐藏,如果像我这么做就多了一点不必要的步骤,后来通过面向百度编程发现了更好的解决方法,记录一下
JQ代码
if(spec=="spec1"){ $("#spec2 option").show(); var values = $("#spec1").val(); $("#spec2 option[value="https://www.it610.com/article/+values+"]").hide(); } if(spec=="spec2"){ $("#spec1 option").show(); var values = $("#spec2").val(); $("#spec1 option[value="https://www.it610.com/article/+values+"]").hide(); }

HTML代码

【多个select下拉框,当选中当前的一项时,其他下拉选都不能选择同样的选项(下拉选的值不能相同)】总结还是别的大佬写的比较好,学习一下

    推荐阅读