1

我有多个按 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]

我想要完成的事情：
每个 containerItem 都有一个单独的最大数量。
假设containerItem0 = 100，containerItem1 = 200，containerItem2 = 300。
现在，当我在containerItem0的输入字段中输入一个数值时，例如20。它应该更新可能在输入字段后面的a，在这种情况下还剩多少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);
});

正如你所看到的，我被困在让整个事情变得动态化。我部分收到 sumOfValues 的警报消息。为什么是部分？它不添加数字，而是将它们作为字符串附加。
另外，我不知道如何遍历所有容器类并监听输入字段的变化。

我期待着得到任何指向正确方向的指示:)

4

1 回答 1

1

您正在使用$(this).val()which 返回input字段的值。这些值确实是字符串，因此+在它们上使用会将它们连接起来。

如果您在添加它们之前解析这些值，它应该会产生您期望的结果：

$(document).change(function() {
  var sumOfValues = 0;
  $(".containerItem0").each(function() {
     sumOfValues += parseFloat($(this).val());
  });
  alert(sumOfValues);
});
于 2012-06-12T18:23:25.510 回答