Question

我从其他页面提取产品价格。然后我将它与数量输入字段中输入的数量相乘。问题是，如果我在提取产品价格数据之前忘记输入数量值，或者如果我稍后更改数量字段，则不会更新最终总价。我希望我能清楚地解释它。

的javascript：

$('#AddProduct').click(function() {
    var i = 0;
    var adding = $(+(i++)+'<div class="row'+(i)+'"><div class="column width50"><input type="text" id="PRODUCTNAME" name="PRODUCTNAME'+(i)+'" value="" class="width98" /><input type="hidden" class="PRODUCTID" name="PRODUCTID" /><input type="hidden" class="UNITPRICE" name="UNITPRICE'+(i)+'" /><small>Search Products</small></div><div class="column width20"><input type="text" class="UNITQUANTITY" name="UNITQUANTITY'+(i)+'" value="" class="width98" /><small>Quantity</small></div><div class="column width30"><span class="prices">Unit Price:<span class="UNITPRICE"></span><br />Total Price:<span class="TOTALPRICE"></span><br /><a href="#" id="RemoveProduct(".row'+(i)+'");">Remove</a></span></div>');    
    $('#OrderProducts').append(adding);

    adding.find("#PRODUCTNAME").autocomplete("orders.cs.asp?Process=ListProducts", {
        selectFirst: false
    }).result(function(event, data, formatted) {
        if (data) {
            adding.find(".UNITPRICE").html(data[1]);
            adding.find(".PRODUCTID").val(data[2]);
            adding.find(".TOTALPRICE").html(data[1] * $('.UNITQUANTITY').val()); 
        }
    });

    return false;
});

$('#RemoveProduct').click(function() {
    $().remove();

    return false;
});

我的HTML：

        <fieldset>
            <h2>Order Items</h2>
            <div id="OrderProducts">
                <a href="#" id="AddProduct"><img src="icons/add.png" alt="Add" /></a>
            </div>  
        </fieldset>

修改

现在我完全搞砸了。删除行也不再有效了......

Answer 1

您可以这样做：

 $('input.UNITQUANTITY').blur(function() {
     var $column = $(this).closest('div.column');
     var unit = $column.find('.UNITPRICE').html();
     $column.find('.TOTALPRICE').html(unit * $(this).val());
 });

我不确定您的HTML是如何设置的，因此您可能需要不同的遍历技术，但这个想法保持不变（每当单位数量发生变化时更新字段）。

Answer 2

对于删除链接，您可以尝试这样做：

<a href="#"  id="row'+i+'");" class="remove">Remove</a></span>

$('a.remove').live('click',function() {
     $('div.'+$(this).attr('id')).remove();
});

将字段值与检索到的值jQuery相乘

2 个答案: