从触发事件的所有下拉菜单中获取选定值

Question

我想检查是否有任何其他与当前选择匹配的选定值。所以当.payment-method变化我得到的价值，并检查其他.payment-method s的值。我想排除触发更改的下拉菜单。 .not(this)不起作用。

$(document).on('change', '.payment-method', function() { 
    var thisVal = $(this).val(); 
    console.log("this value" + thisVal); 

    $(".payment-method option:selected").not(this).each(function() { 
     console.log($(this).val()); 
    }); 
}); 

Answer 1

的问题是因为你使用not()对option元素与this，它引用一个select，因此它总是假的。为了解决这个问题，请致电not()在包含.payment-method元素选择，然后使用find()获得所选的选项，如下所示：

$(document).on('change', '.payment-method', function() { 
 
    $('.payment-method').not(this).find('option:selected').each(function() { 
 
    console.log($(this).val()); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.0/jquery.min.js"></script> 
 
<select class="payment-method"> 
 
    <option value="foo">Foo</option> 
 
    <option value="bar">Bar</option> 
 
    <option value="fizz">Fizz</option> 
 
    <option value="buzz">Buzz</option> 
 
</select> 
 
<select class="payment-method"> 
 
    <option value="foo">Foo</option> 
 
    <option value="bar">Bar</option> 
 
    <option value="fizz">Fizz</option> 
 
    <option value="buzz">Buzz</option> 
 
</select> 
 
<select class="payment-method"> 
 
    <option value="foo">Foo</option> 
 
    <option value="bar">Bar</option> 
 
    <option value="fizz">Fizz</option> 
 
    <option value="buzz">Buzz</option> 
 
</select>

Answer 2

要检查是否有欺骗的值，可以将其过滤，例如：

$(document).on('change', '.payment-method', function() { 

    var thisVal = $(this).val(); 
    console.log("this value" + thisVal); 

    var anyDupeVal = !!$(".payment-method").not(this).filter(function() { 
    return this.value === thisVal 
    }).length; 

    console.log(anyDupeVal); // true or false 

}); 

而如果你希望所有的其他值作为你的标题所暗示的，那么你可以映射它得到值的数组：

var otherValues = $(".payment-method").not(this).map(function() { 
    return this.value 
    }).get(); 

但是，恕我直言，这是不是真的很清楚你期待的结果。