jQuery複数セレクタの構文

Question

人はこの構文が正しいですか？私はdropdown selectを作成し、値を取得しようとしているが、複数のセレクタのこの構文は

var countries = []; 
var locations = []; 
var zips = []; 
$.each($(".country option:selected, .location option:selected ,.zip option:selected"), function(){    
    countries.push($(this).val()); 
    locations.push($(this).val()); 
    zips.push($(this).val()); 
}); 

Answer 1

あなたのやり方は正しいかもしれません。 jQuery.each()メソッドを使用しています。 jQueryオブジェクトをターゲティングする場合は、.each()メソッドを使用します。私は適切な配列に値を適切に配置するための3番目の方法を書いた。ご不明な点がある場合はjQuery APIをご参照ください。情報と役に立つ例が満載です。

/* Method 1 - jQuery.each(object, callback) */ 
 
var countries = []; 
 
var locations = []; 
 
var zips  = []; 
 
$.each($('.country option:selected, .location option:selected, .zip option:selected'), function(index, value) { 
 
    countries.push($(this).val()); 
 
    locations.push($(this).val()); 
 
    zips.push($(this).val()); 
 
}); 
 
console.log('Method 1 - countries', countries); 
 
console.log('Method 1 - locations', locations); 
 
console.log('Method 1 - zips', zips); 
 

 
/* Method 2 - .each(function) */ 
 
var countries = []; 
 
var locations = []; 
 
var zips  = []; 
 
$('.country option:selected, .location option:selected, .zip option:selected').each(function() { 
 
    countries.push($(this).val()); 
 
    locations.push($(this).val()); 
 
    zips.push($(this).val()); 
 
}); 
 
console.log('Method 2 - countries', countries); 
 
console.log('Method 2 - locations', locations); 
 
console.log('Method 2 - zips', zips); 
 

 
/* Suggested Method */ 
 
var countries = []; 
 
var locations = []; 
 
var zips  = []; 
 
$('.country option:selected, .location option:selected, .zip option:selected').each(function() { 
 
    if($(this).parents('.country').length) countries.push($(this).val()); 
 
    if($(this).parents('.location').length) locations.push($(this).val()); 
 
    if($(this).parents('.zip').length) zips.push($(this).val()); 
 
}); 
 
console.log('Suggested Method - countries', countries); 
 
console.log('Suggested Method - locations', locations); 
 
console.log('Suggested Method - zips', zips);

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select class="country"> 
 
    <option>USA</option> 
 
</select> 
 
<select class="location"> 
 
    <option>Florida</option> 
 
</select> 
 
<select class="zip"> 
 
    <option>32935</option> 
 
</select>

Answer 2

はいあなたは構文を次のようにmultiselector使用することができます正しいかどうかはわかりません。

$('#lbl1,#lbl2,#lbl3').css('border','1px solid red');

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
<label id="lbl1">Label 1 </label> <br/> 
 
<label id="lbl2">Label 2 </label> <br/> 
 
<label id="lbl3">Label 3 </label> 
 
    
 
</div>

それはあなたのために働くなら、私を知ってみましょう！

Answer 3

これは、コンソールに出力を表示します。

$('#btn').click(function(){ 
 
    console.log('hi'); 
 
    //console.log($('.country option:selected, .location option:selected').val()); 
 
    
 
    $('.country option:selected, .location option:selected').each(function(){ 
 
    console.log($(this).val()); 
 
    }) 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<select class="country"> 
 
    <option>A</option> 
 
    <option>B</option> 
 
    <option>C</option> 
 
    <option>D</option> 
 
    </select> 
 
    
 
    <select class="location"> 
 
    <option>loc1</option> 
 
    <option>loc2</option> 
 
    <option>loc3</option> 
 
    <option>loc4</option> 
 
    </select> 
 
    
 
    <input type="button" id="btn" value="get"/>