javascript - 如何在 JQuery 中获取所有元素并将它们作为数组发送

Question

在我的购物车中，我的代码每次都会根据用户的选择生成如下结构。每个tr代表一个产品，x表示不同产品的不同值，id是产品的id。所以x,id和number of trs 每次都不同。

<tr>
    <td><span class="product-id" value="x"></span></td>
    <td><img class="product-img" value="x" /></td>
    <td><a class="product-name" value="x"></a></td>
    <td><span class=product-color value="x"></span>
    <td><select  class="qnty-id" value="x"></select></td>
    <td><span class="price-id" value="x"></span></td>
    <td><span class="total-id" value="x"></span></td>
</tr>

我想像这样以数组或 Json 格式收集它们:

array(x => array(
    'id'=>'product-id',
    'name'=>'product-name',
    'color'=>'product-color',
    'quntity'=>'qnty-x',
    'price'=>'price-x',
    'total'=>'total-x')
)

然后使用 Ajax 将它们发送到我的服务器端。 如果有任何帮助，我将不胜感激。

Answer 1

将您的表 ID 视为表，试试这个:

var table = $('#table');
var elems = table.find('tr');
var cartArray = [];
elems.each(function (i, item) {
    var itemSelector = $(item);
    var id = itemSelector.find('.product-id').attr('value');
    var img = itemSelector.find('.product-img').attr('value');
    var name = itemSelector.find('.product-name').attr('value');
    var color = itemSelector.find('.product-color').attr('value');
    var quantity = itemSelector.find('.qnty-id').val();
    var price = itemSelector.find('.price-id').text();
    var total = itemSelector.find('.total-id').text();
    cartArray.push({id: id, img: img, name: name, color: color, quantity: quantity, price: price, total: total});
});
console.log(cartArray);