【问题标题】:html form input javascript sum fieldshtml 表单输入 javascript sum 字段
【发布时间】:2015-06-18 01:47:16
【问题描述】:

我有一个表格,您可以在其中选择客户是否纳税,是否提供折扣,默认价格,折扣后价格,税后价格和总价。

这是我所拥有的:

<table width="339" border="0" cellpadding="0">
    <tr>
        <td width="98">Taxes</td>
        <td width="115">Discount</td>
        <td width="118">Default price</td>
    </tr>
    <tr>
        <td>
            <select class="select" name="taxes">
                <option value="no" selected>no taxes</option>
                <option value="yes">19% taxes</option>
            </select>
        </td>
        <td>
            <select class="select" name="discount" onChange="updateInput()">
                <option value="5" selected>5% discount</option>
                <option value="10">10% discount</option>
                <option value="20">20% discount</option>
            </select>
        </td>
        <td>
            <input type="text" class="input140" name="cost" id="cost" value="1000">
        </td>
    </tr>
    <tr>
        <td>Price after discount</td>
        <td>Taxes</td>
        <td>Total Price to pay</td>
    </tr>
    <tr>
        <td>
            <input type="text" name="price" value="">
        </td>
        <td>
            <input type="text" name="taxes" value="0">
        </td>
        <td>
            <input type="text" name="total" value="0">
        </td>
    </tr>
</table>
<script>
    function updateInput() {
        var discount = document.getElementsByName("discount")[0].value;
        var cost = document.getElementsByName("cost")[0].value;
        document.getElementsByName("price")[0].value = cost - (cost * (discount / 100));
    }
</script>

我正在尝试使此表单工作,但如果我重复使用的 javascript,它就不起作用。

这里是演示小提琴

https://jsfiddle.net/nte6xqdv/6/

我们的默认价格为 1.000 工作正常,如果我们向客户添加折扣,它会在折扣后更改为价格

但是 如果我对 19% 的税收选择“是”,它确实不会改变任何东西,并且在折扣加税后支付的总价格也不起作用。有什么想法吗?

【问题讨论】:

标签: javascript php jquery html


【解决方案1】:

您的代码几乎没问题,只需要一些小修复:您为选择“taxes”和输入“taxes”(现在为“ttaxes”)使用相同的名称,您将值“yes”分配给了 tax (我把它改了 19),最后,复制粘贴你自己的代码来计算折扣(用于计算税收)。现在你只有一件事要做:计算两者的总和(总价)。在这里,更改由注释箭头指出:

<html>
  <body>
<table width="339" border="0" cellpadding="0">
  <tr>
    <td width="98">Taxes</td>
    <td width="115">Discount</td>
    <td width="118">Default price</td>
  </tr>
  <tr>
    <td><select class="select" name="taxes" onChange="updateInput()">
      <option value="no" selected>no taxes</option>
      <option value="19">19% taxes</option> <!-- <====================== -->
    </select></td>
    <td><select class="select" name="discount" onChange="updateInput()">
      <option value="5" selected>5% discount</option>
      <option value="10">10% discount</option>
      <option value="20">20% discount</option>
    </select></td>
    <td><input type="text" class="input140" name="cost" id="cost" value="1000"></td>
  </tr>
  <tr>
    <td>Price after discount</td>
    <td>Taxes</td>
    <td>Total Price to pay</td>
  </tr>
  <tr>
    <td><input type="text" name="price" value=""></td>
    <td><input type="text" name="ttaxes" value="0"></td> <!-- <====================== -->
    <td><input type="text" name="total" value="0"></td>
  </tr>
</table>
<script type="text/javascript">
function updateInput(){
    var discount = document.getElementsByName("discount")[0].value;
    var cost = document.getElementsByName("cost")[0].value;
    document.getElementsByName("price")[0].value = cost - (cost * (discount / 100));

    var taxes = document.getElementsByName("taxes")[0].value; // <======================
    if ( isNaN( taxes ) ) // IF "no taxes" IS SELECTED...
         document.getElementsByName("ttaxes")[0].value = 0;
    else { cost = document.getElementsByName("cost")[0].value;
           document.getElementsByName("ttaxes")[0].value = (cost * (taxes / 100));
         }

    document.getElementsByName("total")[0].value = 
      parseFloat( document.getElementsByName("price")[0].value ) +
      parseFloat( document.getElementsByName("ttaxes")[0].value );
}
</script>
  </body>
</html>

【讨论】:

  • Jose muchas gracias esta funcionando casi perfecto, lo unico que me falta es que el precio final sume precio mas iva mas descuento automaticamente。 Me podrias dar una mano con eso porfa?
  • @maradoiano, ya casi se lo tengo!
  • puse otra pregunta, responde alla para que salga electrorecta
  • 马拉多亚诺,答案编辑。 El cambio está al final de la función "updateInput", todo lo que hace es sumar los dos inputs y desplegar el resultado en el último input。 ¡ Conrespecto a la otra pregunta, pues resulta que StackOverflow podría anular la otra pregunta porque resulta muy parecida a esta, yo le recomendaría a maradoiano que eliminara la otra pregunta, con el fin de evitar algún tipo de penalización (así son las cosas aquí en堆栈溢出)。 De hecho, ya empezaron a castigar la pregunta con votos negativos。
  • El tipo que respondió la otra pregunta lo hizo bien。 Acéptela, está buena.
猜你喜欢
  • 1970-01-01
  • 1970-01-01
  • 2021-11-02
  • 2011-05-01
  • 1970-01-01
  • 2016-05-06
  • 2017-09-30
  • 1970-01-01
相关资源
最近更新 更多