我有多个输入文本字段分组在div 中：
<div class="container0">
<input class="containerItem0" name="containerItem[0][0]" id="containerItem_0_0" type="text">
<input class="containerItem1" name="containerItem[0][1]" id="containerItem_0_1" type="text">
</div
<div class="container1">
<input class="containerItem0" name="containerItem[1][0]" id="containerItem_1_0" type="text">
<input class="containerItem1" name="containerItem[1][1]" id="containerItem_1_1" type="text">
</div>
<div class="container2">
<input class="containerItem0" name="containerItem[2][0]" id="containerItem_2_0" type="text">
<input class="containerItem1" name="containerItem[2][1]" id="containerItem_2_1" type="text">
</div>
让我解释一下这段代码：
我有三个容器：0，1 和 2。但是，这是可变的。可能或多或少。在每个容器中，我总是有相同数量的项目，在本例中为两个。这也可能有所不同，但所有容器的数量始终相同。
同类的物品是同一种物品！唯一的区别是它们在不同的容器中。
每个输入项的名称和 ID 在我的 php 脚本中用于在提交表单后确定：
containerItem[1][0]
containerItem[ContainerNumber][Item]
我想要完成什么：
每个容器项都有一个单独的最大金额。
假设 containerItem0 = 100，containerItem1 = 200，containerItem2 = 300。
现在，当我在 containerItem0 的输入字段中输入数值时，例如 20。它应该更新一个 这可能在输入字段后面还剩多少，在本例中为 80。
它不仅应该更新我刚刚输入数值的输入字段后面，而且还应该更新所有其他 containerItem0 的后面。
我尝试了什么
// php part
// Create variables for use in jquery for the max values for the containerItems
$jqueryVars="";
$j=0;
// containerItems is an array I get with the numberOrdered value which equals the maximum number allowed
foreach ($containerItems as $key => $value) {
$jqueryVars .= "var maxContainerItem".$j." = ".$value['NumberOrdered'].";'n";
$j++;
}
// jQuery part:
// Calculate left amount of container items.
'$(document).change(function() {
'.$jqueryVars.'
var sumOfValues = 0;
//I USED >>.containerItem0<< in this case to see if it works, however this should be variable
$(".containerItem0").each(function(){
sumOfValues+=$(this).val();
});
alert(sumOfValues);
});
正如你所看到的，我被困在使整个事情动态化。我部分收到总和值的警报消息。为什么是部分？它不会添加数字，而是附加它们，因为它们是字符串。
另外，我不知道如何遍历所有容器类并侦听输入字段中的更改。
我期待着得到任何指向正确方向的指示:)
您正在使用返回input字段值的$(this).val()。这些值确实是字符串，因此对它们使用 + 将连接它们。
如果在添加值之前解析这些值，它应该会产生您所期望的结果：
$(document).change(function() {
var sumOfValues = 0;
$(".containerItem0").each(function() {
sumOfValues += parseFloat($(this).val());
});
alert(sumOfValues);
});