选择mutli div中的多输入

时间:2014-05-07 23:04:43

标签: javascript jquery html

为构建零售产品构建CRM应用程序

以收到的形式,可能包含来自同一类别的多种产品

这里是一个类别的例子

<div id="frame_item">
<label>شنبر</label>
<input type="text" id="frame_code" name="frame_code" onfocus="autoSelectFrame(&quot;frame_code&quot;)">
<label>بيانات الشنبر</label>
<input type="text" id="frame_details" name="frame_details" disabled>
<label>سعر الشنبر</label>
<input type="text" id="frame_sell_price" name="frame_sell_price" value="5" class="frame_sell_price" disabled>
<label>الكمية</label>
<input type="text" id="frame_quantity" name="frame_quantity" class="frame_quantity" value="1" onchange="updateItemPrice(&quot;frame&quot;);">
<input type="text" id="frame_total_price" name="frame_total_price" class="frame_total_price" value="" disabled>

假设数量变化,它会改变物品的总价格

所以这是我为它制作自定义函数的jquery代码

function updateItemPrice(x)
{
    var finalPrice = 0;
    $(".frame_item").each(function(i){
        var quantity = $(".frame_quantity").val();
        var price = $(".frame_sell_price").val();
        finalPrice = parseInt(quantity) * parseInt(price);
        //$(".frame_total_price").val(finalPrice);
        alert(finalPrice);
    });
}

它使用相同的值更新所有问题

1 个答案:

答案 0 :(得分:1)

问题是$(".frame_quantity")$(".frame_sell_price")都从文档根目录中搜索并找到所有匹配的元素。然后val()检索第一个匹配元素的值。

您需要的是:

var finalPrice = 0;
$(".frame_item").each(function(i){
    var item = $(this);
    var quantity = item.find(".frame_quantity").val();
    var price = item.find(".frame_sell_price").val();
    finalPrice = parseInt(quantity) * parseInt(price);
    item.find(".frame_total_price").val(finalPrice);
    alert(finalPrice);
});

这将触发搜索当前项目中的数量和价格。

同样来自jQuery选择器我假设<div id="frame_item">实际上是<div class="frame_item">