javascript - 表单字段值不变

Question

我正在练习编写 HTML 表单并使用 JavaScript 函数。

这是我的表格:

   <form method="post" id= "form1" name="form1" data-ajax="false"  action="<?php echo $editFormAction; ?>">
            <p>
              Moneda del Presupuesto:
              <select name="int_moneda">
                <option value="1" <?php if (!(strcmp(1, ""))) {echo "SELECTED";} ?>>PESO MXN</option>
                <option value="2" <?php if (!(strcmp(2, ""))) {echo "SELECTED";} ?>>USD</option>
              </select>
            </p>
            <p>Obra:            
              <select name="int_obra">
                <?php 
do {  
?>
                <option value="<?php echo $row_Recordset1['idObra']?>" ><?php echo $row_Recordset1['nombreObra']?></option>
                <?php
} while ($row_Recordset1 = mysql_fetch_assoc($Recordset1));
?>
              </select>
            </p>
            <p>Materiales:            
              <input type="text" name="dbl_materiales" value="" size="32" id = "mat" onChange="calculatetotal()">
            </p>
            <p>Mano de Obra: 
              <input type="text" name="dbl_mano_de_obra" value="" size="32" id = "mo"onChange="calculatetotal()">
            </p>
            <p>Utilidades: 
              <input type="text" name="dbl_utilidad" value="" size="32" id = "uti" onChange="calculatetotal()">
            </p>
            <p>Indirectos: 
              <input type="text" name="dbl_indirectos" value="" size="32" id = "ind" onChange="calculatetotal()">
            </p>
            <p>Pres.Aprobado por cliente: 
              <input name="dbl_total" type="text" id = "totCliente" value="" size="32" readonly="readonly" >
            </p>
            <p>% IVA: 
              <input type="text" name="dbl_porcentaje_iva" value="16.0" size="32" id="poriva">
            </p>
            <p>Total IVA: 
              <input type="text" name="dbl_total_iva" value="" size="32" id="totaliva">
            </p>
            <p>Total PRESUPUESTO:
              <input type="text" name="dbl_total_presupuesto" value="" size="32" id="totalpresupuesto">
            </p>
            <p>
              <input type="hidden" name="MM_insert" value="form1">
            </p>
          </form>

这是我的测试 JavaScript:

<script type="text/javascript"> 
function calculatetotal(){
    var mat = 0;
    mat = document.getElementById('mat').innerHTML;
    document.getElementById('totCliente').innerHTML = mat;
}
</script>

如果更改“mat”字段值，“totCliente”字段应该即时获取该值，但任何情况都会发生。

如果让这部分工作，我稍后将添加其他字段值，第一个字段只是为了检查为什么它不工作。

谢谢

Answer 1

而不是使用 innerHTML ，使用value :

<script type="text/javascript"> 
function calculatetotal(){
    var mat = 0;
    mat = document.getElementById('mat').value;
    document.getElementById('totCliente').value = mat;
}
</script>

这是 <input> 的一种特殊情况。元素。