几个选择框重复值进行比较

Question

我想比较选择框选择的选项值，如果选择框中有重复值，我想显示警报：

alert("Duplicate value!");

这是我的代码：

<select class="examSelect">
    <option value="one">ba</opion>
    <option value="two">woo</opion>
    <option value="three">coo</opion>
    <option value="four">po</opion>
</select>
<select class="examSelect">
    <option value="one">ba</opion>
    <option value="two">woo</opion>
    <option value="three">coo</opion>
    <option value="four">po</opion>
</select>
<select class="examSelect">
    <option value="one">ba</opion>
    <option value="two">woo</opion>
    <option value="three">coo</opion>
    <option value="four">po</opion>
</select>

Answer 1

这里有一种使用对象属性的方法。它在第一次看到属性时创建该属性，如果第二次看到相同的值，它就会爆发并发出警报。

这可以很容易地修改以保持重复计数，例如"您为3个不同的选择输入了‘woo’！"

它还可以扩展到HTML中的其他选择框，无需修改，因为它使用jQuery each()来调查每个匹配的下拉列表。

function checkit() {
    var checker = {};
    $(".examSelect").each(function() {
        var selection = $(this).val();
        if ( checker[selection] ) {
            //if the property is defined, then we've already encountered this value
            alert("Duplicate(s) detected!");
            return false;
        } else {
            //first time we've seen this value, so let's define a property for it
            checker[selection] = true;
        }
    });
    console.log(checker); //remove this in production
}

https://jsfiddle.net/y5y9uy5v/2/

Answer 2

您可以使用类似的方法来比较所有三个select。。下一个代码将检查它们是否都具有相同的值alert yes如果您需要的话进行陈述

$(document).ready(function(){
    $('.examSelect').on('change',function(){
        var examSelect0 = $('.examSelect').eq(0).val();
        var examSelect1 = $('.examSelect').eq(1).val();
        var examSelect2 = $('.examSelect').eq(2).val();
        if(examSelect0 == examSelect1 && examSelect1 == examSelect2){
            alert('yes');
        }
    });
});

演示

如果其中两个上的值重复，则可以使用此if语句

if(examSelect0 == examSelect1 || examSelect1 == examSelect2 || examSelect0 == examSelect2){
     alert("Duplicate value!");
 }