Question

我有多个输入文本字段以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.但这是可变的。可能会有更多或更少。在每个容器中，我总是有相同数量的项目，在这种情况下是两个。这也可能有所不同，但所有容器的数量总是相同的具有相同类别的项目是相同的项目！唯一的区别是它们在不同的容器中我的php脚本中使用每个输入项的名称和ID来确定提交表单后：

containerItem[1][0]
containerItem[ContainerNumber][Item]

我想要完成的任务：
每个containerItem都有一个单独的最大数量假设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);
});

正如你所看到的那样，我被困在整个事物中。我部分得到了sumOfValues的警告信息。为何部分？它不会添加数字，而是将它们作为字符串附加另外，我不知道如何遍历所有容器类并监听输入字段中的更改。

我期待着能够指出正确的方向：）

Answer 1

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

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

$(document).change(function() {
  var sumOfValues = 0;
  $(".containerItem0").each(function() {
     sumOfValues += parseFloat($(this).val());
  });
  alert(sumOfValues);
});

从给定的最大数量中减去并输出数字输入值

1 个答案: