修改旧的JavaScript代码来新

Question

旧的HTML和JavaScript代码：

<tr> 
<input id="pret_id_1" type="text" name="pret" /> 
<input id="val_id_1" type="text" name="val"/> 
<input id="val_tva_id_1" type="text" name="val_tva"/> 
<input id="cant_id_1" type="text" name="cant" /> 
</tr> 

<script> 
    var x=document.form_factura; 
    x.val.value = (x.pret.value * x.cant.value).toFixed(2) ; 
    x.val_tva.value = ((x.pret.value * x.cant.value) * tva_val).toFixed(2);  

    if(!/^[a-z()+ A-Z()-]*$/.test(x.val_tva.value)){   
    var suma = (x.pret.value * x.cant.value)- (-x.val_tva.value); 
    } else { 
    var suma = (x.pret.value * x.cant.value); 
    }  
    x.suma.value = suma.toFixed(2); 
    ... 
</script> 

我尽量乘这个..我的名字元素的加入阵列。

<tr class="row1"> 
<input id="pret_id_1" type="text" name="pret[]" /> 
<input id="val_id_1" type="text" name="val[]"/> 
<input id="val_tva_id_1" type="text" name="val_tva[]"/> 
<input id="cant_id_1" type="text" name="cant[]" /> 
</tr> 
<tr class="row2"> 
<input id="pret_id_2" type="text" name="pret[]" /> 
<input id="val_id_2" type="text" name="val[]"/> 
<input id="val_tva_id_2" type="text" name="val_tva[]"/> 
<input id="cant_id_1" type="text" name="cant[]" /> 
</tr> 

如何更新数组输入名称元素的javascript代码？

如果它只有一行（.row1），javascript无法正常工作..必须至少有2个具有相同名称的元素。

编辑：我忘了提及我使用php和mysql来存储数据。

谢谢。

Answer 1

那么你有独特的ID，所以你可以循环

for(var i=1;i<=2;i++) { 
    var pret = document.getElementById("pret_id_" + i); 
    var cant = document.getElementById("cant_id_" + i); 
    var val = document.getElementById("val_id_" + i); 
    val.value = (pret.value * cant.value).toFixed(2) ; 
} 

如果你wan t去做它的名字，

var pretElems = document.form_factura["pret[]"]; 
var cantElems = document.form_factura["cant[]"]; 
var valElems = document.form_factura["val[]"]]; 


for(var i=1;i<=2;i++) { 
    var pret = pretElems[i]; 
    var cant = cantElems[i]; 
    var val = valElems[i]; 
    val.value = (pret.value * cant.value).toFixed(2) ; 
} 

Answer 2

首先你不应该在字段的名称添加[]：

<tr class="row1"> 
<input id="pret_id_1" type="text" name="pret" /> 
<input id="val_id_1" type="text" name="val"/> 
<input id="val_tva_id_1" type="text" name="val_tva"/> 
<input id="cant_id_1" type="text" name="cant" /> 
</tr> 
<tr class="row2"> 
<input id="pret_id_2" type="text" name="pret" /> 
<input id="val_id_2" type="text" name="val"/> 
<input id="val_tva_id_2" type="text" name="val_tva"/> 
<input id="cant_id_1" type="text" name="cant" /> 
</tr> 

然后x.val将返回DOM元素的数组（而不是一个单一的元素像前）：

<script> 
    var x=document.form_factura; 
    for(var i=0; i<x.pret.length; i++) { 
    x.val[i].value = (x.pret[i].value * x.cant[i].value).toFixed(2) ; 
    x.val_tva[i].value = ((x.pret[i].value * x.cant[i].value) * tva_val).toFixed(2);  

    if(!/^[a-z()+ A-Z()-]*$/.test(x.val_tva.value)){   
     var suma = (x.pret[i].value * x.cant[i].value)- (-x.val_tva[i].value); 
    } else { 
     var suma = (x.pret[i].value * x.cant[i].value); 
    }  
    x.suma[i].value = suma.toFixed(2); 
    ... 
    } 
</script>