使用jQuery按鈕

Question

的點擊選擇多個列表項的值我有一個類似的列表（含鋰的任意數量）：

<ul> 

<li> 
    <div class="box"> 
    <table> 
    <tr> 
    <td>Product 1</td> 
    <td><input type="hidden" class="hiddenid" value="5" /></td> 
    <td><input type="checkbox" value="yes" /></td> 
    </tr> 
    </table> 
    </div> 
</li> 


<li> 
    <div class="box"> 
    <table> 
    <tr> 
    <td>Product 2</td> 
    <td><input type="hidden" class="hiddenid" value="6" /></td> 
    <td><input type="checkbox" value="yes" /></td> 
    </tr> 
    </table> 
    </div> 
</li> 


</ul> 

<input type="submit" id="submit" /> 

，我需要通過每一個項目使用jQuery循環，一旦點擊了#submit（最終我會將這個字符串傳遞給一個php頁面和一個數據庫），就可以通過一個複選框收集每個項目的#hiddenid值。

這是我嘗試在JQuery的，但是是相對初學者（即小白）我很失落......

<script> 
$(document).ready(function() { 

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

    var id = $.each("#stockyesno:checked").closest(".box").find(".hiddenid").val(); 

    alert(id); 

    }); 


}); 
</script> 

我希望有一種方法來糾正我的ID的穿越變量，所以它不會更復雜...

我簡化了這個問題，但我敢肯定，如果這可以回答我可以縮放答案我更復雜的代碼。

感謝您的幫助！

Answer 1

你試圖寫

var ids = $(".stockyesno:checked").map(function() { 
    return $(this).closest(".box").find(".hiddenid").val(); 
}).get(); 
var idString = ids.join(','); 

該代碼使用jQuery的正常通話，以獲得選中的元素，然後調用map method到複選框集轉換成一組值的字符串。
然後它調用get將字符串的jQuery對象轉換爲普通數組。
最後，它調用Javascript join方法將數組轉換爲單個逗號分隔的字符串。

Answer 2

考慮這樣的結構：

<ul> 
    <li> 
     Product 1 
     <input type="hidden" class="hiddenid" value="5" /> 
     <input type="checkbox" value="yes" /> 
    </li> 
    <li> 
     Product 2 
     <input type="hidden" class="hiddenid" value="6" /> 
     <input type="checkbox" value="yes" /> 
    </li> 
</ul> 

Answer 3

如果你試圖確定哪些產品的複選框被選中，也有更簡單的方法。

例如，如果您的複選框領域是這樣的：

<input type="checkbox" name="product_id_1" id="product[1]" value="yes" /> 
<input type="checkbox" name="product_id_2" id="product[2]" value="yes" /> 
<input type="checkbox" name="product_id_3" id="product[3]" value="yes" /> 

你會那麼可以在提交給服務器使用的名稱和它們的值。例如，如果您選擇了第一個和最後一個複選框，則可以使用URL參數product_id_1 = yes和product_id_3 = yes來處理。

簡單仍然：

<input type="checkbox" name="product_id" value="1" /> 
<input type="checkbox" name="product_id" value="2" /> 
<input type="checkbox" name="product_id" value="3" /> 

當所有這些複選框被選中，則PRODUCT_ID URL參數的值將是1,2,3。如果僅選擇2和3，則值爲2,3。選擇第一個複選框會導致值爲1.

值得指出的是，在您的示例代碼中，您在隱藏字段上具有重複的ID。這可能是一個疏忽，因爲你試圖創建簡單的示例代碼。如果沒有，這個事實肯定會讓你的問題複雜化。元素ID必須是唯一的。