複数の動的に生成された複数の選択に対してsubmit時のJquery選択値

Question

クラス名のみを使用して特定の値を取得できるかどうかを確認しようとしています。 それは可能ですか？

すべての選択は動的に生成され、同じクラス名を持ちます。すべての送信ボタンも同じクラス名を持ちます。

<div> 
<select class="mystat" name="mystat" style="width: 140px"> 
    <option value="1" selected="selected">option 1</option> 
    <option value="2">option 2</option> 
    <option value="3">option 3</option> 
</select> 
<button class="go-btn" type="submit">Update</button> 
</div> 


$(document).on('click', '.go-btn', function(){ 
    var mystat = $('.mystat').val(); 
    alert('Value is ' + mystat); 
}); 

Fiddle

すべてのヘルプは大幅に$(this)に対する

Answer 1

使用DOMナビゲーションを高く評価しています。

$(document).on('click', '.go-btn', function() { 
 
    var mystat = $(this).siblings('.mystat').val(); 
 
    alert('Value is ' + mystat); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<div> 
 
    <select class="mystat" name="mystat" style="width: 140px"> 
 
    <option value="1" selected="selected">option 1</option> 
 
    <option value="2">option 2</option> 
 
    <option value="3">option 3</option> 
 
</select> 
 
    <button class="go-btn" type="submit">Update</button> 
 
</div> 
 
<div> 
 
    <select class="mystat" name="mystat" style="width: 140px"> 
 
    <option value="1" selected="selected">option 1</option> 
 
    <option value="2">option 2</option> 
 
    <option value="3">option 3</option> 
 
</select> 
 
    <button class="go-btn" type="submit">Update</button> 
 
</div> 
 
<div> 
 
    <select class="mystat" name="mystat" style="width: 140px"> 
 
    <option value="1" selected="selected">option 1</option> 
 
    <option value="2">option 2</option> 
 
    <option value="3">option 3</option> 
 
</select> 
 
    <button class="go-btn" type="submit">Update</button> 
 
</div>

Answer 2

selectタグは、各ブロックのボタンの前にあるので

VAR MYSTAT = $（この）.prev（）のval（）、これを試してください。