Jquery在搜索结果中禁用所有具有相同类的单个按钮

时间:2011-10-12 08:53:25

标签: javascript jquery

如果你看一下:http://www.thebullionstore.co.uk/_shop/?_cat=9

您将看到一个产品列表,每个产品都包含在带有product_box类的div中。在product_box里面有几个其他div和一个带有添加到购物车按钮的表单。在表单内部有一个名为stock_amount的隐藏输入字段,其值为value,value属性是库存中每个产品的数量。 Iv还在stock_amount类名称中添加了一个数字基,以区分每个产品列表,例如stock_amount0,stock_amount1 ans等。

我希望能够在一定量的点击后禁用每个产品的每个按钮。点击量将等于stock_amount的值,因此实际上用户无法向购物车添加的产品数量超过可用数量。

目前使用Jquery添加到购物车但我不知道jquery是否足以弄清楚如何遍历每个产品列表并执行上面描述的操作。

非常感谢任何帮助。

2 个答案:

答案 0 :(得分:0)

要循环使用透明元素,您可以使用jQuery.each()。或写下这样的东西:

var nodes = $("form");
for(var i=0; i<nodes.length; i++) {
    var node = nodes[i];
    // do something
}

但我认为你不需要这样做。您可以在click-event-handler中执行检查和禁用按钮。此外,您不应忘记检查输入的金额(例如1000)是否超过库存量。

答案 1 :(得分:0)

$("button.addtocart").click(function(e) {
    // fetch <input name='stock_amount'> within the clicked buttons form element
    var stock_amount_input = $("input[name='stock_amount']", $(this).parent());
    // fetch <input name='_qty'> within the clicked buttons form element
    var qty_input = $("input[name='_qty']", $(this).parent());
    // maybe you want to do some check here
    var new_amount = stock_amount_input.val() - qty_input.val();
    // set the new calculated value in the stock_amount input
    stock_amount_input.val(new_amount);

    // if the new_amount is less than 1 we dissable the clicked button
    if(new_amount < 1) {
        $(this).attr("disabled", "disabled");
    }
});