Jquery只從複選框列表中獲取所有選中的值

Question

我是jQuery和html中的新成員。我試圖從複選框列表中獲取所有選中的值，但是我的腳本返回所有值而不是檢查。

繼我的html：

<input type="button" value="Show selected" onclick="return false" class="showSelectedOnly"> 

<table> 

<tr> 
<td> 
<input type="checkbox" class="order_row" data-order-id="20161004-135848" name="sel20161004-135848" ></td> 
</tr> 
<tr> 
<td> 
<input type="checkbox" class="order_row" data-order-id="20161004-135848" name="sel20161004-135848" ></td> 
</tr> 

<tr> 
<td> 
<input type="checkbox" class="order_row" data-order-id="20161004-135848" name="sel20161004-135848" ></td> 
</tr> 

</table> 

我的JS腳本：

$(".showSelectedOnly").click(function(){ 

    $('.order_row:checkbox:checked').each(function() { 
     var sThisVal = $(this).attr("data-order-id"); 
     alert(sThisVal); 
    }); 
    }); 

請讓我知道爲什麼我的腳本不能只返回檢查的值。

Answer 1

爲什麼你正在使用$（ 'order_row：複選框：選中 '）只使用$（' order_row：檢查'）檢查下面的答案希望這將幫助 -

$(".showSelectedOnly").click(function(){ 
 

 
    $('.order_row:checked').each(function() { 
 
     var sThisVal = $(this).attr("data-order-id"); 
 
     alert(sThisVal); 
 
    }); 
 
    });

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<input type="button" value="Show selected" onclick="return false" class="showSelectedOnly"> 
 

 
<table> 
 

 
<tr> 
 
<td> 
 
<input type="checkbox" class="order_row" data-order-id="20161004-135848" name="sel20161004-135848" ></td> 
 
</tr> 
 
<tr> 
 
<td> 
 
<input type="checkbox" class="order_row" data-order-id="20161004-135848" name="sel20161004-135848" ></td> 
 
</tr> 
 

 
<tr> 
 
<td> 
 
<input type="checkbox" class="order_row" data-order-id="20161004-135848" name="sel20161004-135848" ></td> 
 
</tr> 
 

 
</table>

Answer 2

只要你所有的檢查數據存儲在陣列中的如下

$(".showSelectedOnly").click(function(){ 
    var selected = []; 
    $('.order_row:checkbox:checked').each(function() { 
    var sThisVal = $(this).attr("data-order-id"); 
    selected.push(sThisVal); 
    }); 
    alert(selected); 
});