從觸發事件的所有下拉菜單中獲取選定值

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(); 

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