几个选择框重复值比较

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

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

这可以很容易地修改以保持重复计数，例如“您输入了 'woo' 以进行 3 种不同的选择！”

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

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 .. 制作您需要的 if 语句

$(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');
        }
    });
});

DEMO

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

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