Javascript 使用输入字段和每个函数进行计算

也许是个愚蠢的问题，但我找不到答案。仍在学习：

我有一个表单，其中有两个具有相同类名的输入字段。我试图获取这两个值并计算平方米和价格。 获取输入值不是问题，但将值存储在变量中则是问题

为了计算价格，我需要做一些类似于lx wx price的事情。但是，当使用时，如何创建两个长度和宽度变量。每个函数名当然可以不同？这是一个好方法吗

添加ID或类名不是一个选项，因为所有内容都是动态创建的

所以我得到的是：

function update_amounts() {
  var price = '129';
  var sum = 0;  

  $('#product_configure_form .product-configure-custom-option input').each(function(){

   var value = parseFloat($(this).val()) / 100;

  });
      // Here I need to do something like 
      sum = value1 * value2 * price
      ////////////////////////////////// 

       var sumsum = sum.toString().replace(/\./g, ',');    
       $('.price-wrap .price').text('€ ' + sumsum);
     }

     $(document).ready(function(){
       $("#product_configure_form").on("change", ".product-configure-custom-option input", update_amounts);
     });

试试这个：

 function update_amounts() {
 var price = '129';
 var sum = 0;  
  $('#product_configure_form .product-configure-custom-option input').each(function( i,el ){

 sum += parseFloat( el.value ) / 100;

 });

   sum = sum.toString().replace(/\./g, ',');   

   $('.price-wrap .price').text('€ ' + sum);
 }

 $(document).ready(function(){
   $("#product_configure_form").on("change", ".product-configure-custom-option input", update_amounts);
 });

---

更好的方法是使用类或数据属性。这将使您的代码更具可读性

如果您想继续当前的方法，请遵循以下步骤

如果您知道输入框的索引，即它们的排列顺序，则可以使用：

var values={value1:0,value2:0};
$('#product_configure_form .product-configure-custom-option input').each(function(index, element){
    if(index==0)
    {
        values.value1=$(element).val();
    }
    else if(index==1)
    {
        values.value2=$(element).val();
    }
});
//now value1 has the first, and value2 has the second
//then do sum = values.value1 * values.value2 * price

---

在函数上方设置一个全局变量，该函数允许您保存变量值，或者您可以使用.next内部循环选择下一个元素。我认为你的方法是正确的，只是需要一些修改，添加html以获得更多帮助

var价格=129； document.getElementById'bar'。addEventListener'click'，functionval{ var inputs=document.querySelectorAll'foo input'； var res=Array.frominputs//或[].slice.callinputs（适用于旧浏览器） .reducefunctionnow，pre{return now.value*pre.value}*price； document.getElementById'res'.innerHTML=res.toString.replace'.'、'.'、'+'€'； }; 点击

---

下面是您给出的代码的修改工作示例：

函数更新\u数量{ var价格='129'； var总和=0； var值1、var值2； value1=parseFloat$'value1'.val/100； value2=parseFloat$'value2'.val/100； //在这里，我需要做一些类似的事情 总和=值1*值2*价格； ////////////////////////////////// var sumsum=sum.toString.replace/\./g'，'； $“价格”。文本“€”+总和； } $document.readyfunction{ $document.onchange，输入，更新金额； 更新金额； }; 价值1： 价值2：

---

因为您有固定数量的元素，所以可以跳过foreach，只需使用jQuery选择器来查找这两个值，并根据需要对它们执行任何操作

    val1 = $(".product-configure-custom-option:first").val()
    val2 = $(".product-configure-custom-option:nth(1)").val()

---

你能把你的html也给我吗？我会给你写一个代码笔的例子，告诉你我会怎么做：如果希望获得这样的值，则需要为两个输入设置不同的id，而不是使用类。另外，您的两个变量value1和value2在哪里声明？我没有想到这一点。由于固定字段，这是有用的，因为无论我使用val1 x val2还是反之亦然。