在每個迭代中選擇帶有jquery元素的手柄條

我正在爲鍛鍊電子商店而建設。我使用把手在HTML中顯示產品列表。在每個迭代中選擇帶有jquery元素的手柄條

對於每一個元素，我添加一個按鈕，應該允許用戶在購物車中添加物品。這不起作用，因爲每次我點擊按鈕時，我都會添加所有列表，而不僅僅是單個對象。所以我知道我通過了所有的列表（因爲我通過'列表'作爲參數），我想知道如何只傳遞每個按鈕的當前項目。我不知道該怎麼做。

HTML：

<div class="container-fluid"> 
    <script id="list-items" type="text/x-handlebars-template"> 
     {{#each list}} 
     <div class="items col-lg-3 col-md-4 col-sm-6 col-xs-12"> 
      Category: {{ category}} </br> 
      Name: {{ name }} </br> 
      Price: {{ price }} </br> 
      Quantity: {{ quantity }} 
      <button class="addItem" class="btn">Buy</button> 
     </div> 
     {{/each}} 
    </script> 
    </div>

的javascript：

var ShoppingCart = function() { 
    this.cart = []; 
}; 

ShoppingCart.prototype.addItem = function(item) { 
    this.cart.push(item); 
}; 


shoppingCart = new ShoppingCart(); 

$('.addItem').click(function() { 
    shoppingCart.addItem(list); 
});

來源

2015-09-16 Massimiliano Mura

'每當我點擊按鈕，我就完全添加所有列表！ =>'shoppingCart.addItem（list）;' – pomeh

如何識別哪個項目被點擊？可能的解決方案：通過索引，itemId或名稱？列表項目的結構是什麼？ – MaxZoom

在你點擊功能，你加起來正是整個列表：

shoppingCart.addItem(list);

而你並不需要將整個項目轉讓被添加。由於您已經在範圍中列出了整個列表，因此您只需要讓函數知道選定的索引是什麼。可能的解決方案可能是通過把按鈕id添加到按鈕id然後解析它在jQuery中，並繼續或考慮替換jQuery的方式訂閱純JavaScript解決方案的點擊事件，並插入項目的索引與手柄的幫助，在方式：

<button class="addItem" class="btn" onclick="addItem({{@index}})">Buy</button>

其中addItem是：

function addItem(index) { 
    shoppingCart.addItem(list[index]); 
}

來源

2015-09-16 16:11:50 teamnorge

我猜（如別處指出或索引），你可以用一個項目編號排序了這一點：

<button id="{{ @index }}" class="addItem" class="btn">Buy</button> 

$('.addItem').click(function() { 
    shoppingCart.addItem(list[$(this).id]); 
});

來源

2015-09-16 16:12:46 PinkTurtle

在每個迭代中選擇帶有jquery元素的手柄條

回答

相關問題