通过js使用金额和折扣计算总额?

时间:2014-06-05 07:31:34

标签: javascript php

我有一些文本框。我的Html代码是:

<input type="text" id="amt_5" onkeyup="calculateTotal(5);" style="width:50px" name="data[Fee][fee_to]">
<input type="text" id="dis_5" onkeyup="calculateTotal(5);" style="width:50px" name="data[Fee][fee_to]">
<input type="text" id="total_5" style="width:50px" name="data[Fee][fee_to]">

<input type="text" id="amt_6" onkeyup="calculateTotal(6);" style="width:50px" name="data[Fee][fee_to]">
<input type="text" id="dis_6" onkeyup="calculateTotal(6);" style="width:50px" name="data[Fee][fee_to]">
<input type="text" id="total_6" style="width:50px" name="data[Fee][fee_to]">



Total Fees Amount
<span id="Fees_amt" style="margin-left:20px;"></span>

我的js代码是:

<script>
   function calculateTotal(pid){

       //alert($id_particular);
      var amt=document.getElementById('amt_'+pid).value;
      var dis=document.getElementById('dis_'+pid).value;
      if(amt != "" && dis != ""){
      var total = (amt-((dis*amt)/100));
      }
      else if(amt != "" && dis == ""){
      var total = amt;
      }
     else{
     var total = "";
     }
     document.getElementById('total_'+pid).value=total;
     }
</script>

以上代码基本上如下: 从textbox(amt_5,amt_6)获取金额值,从textbox(dis_5,dis_6)获取折扣值,通过js计算textbox(total_5,total_6)的总数和填充数

现在我想做的是: 无论总数是total_6还是total_5,都会添加并填充我的span元素Fees_amt

这应该通过js来完成,增强我的js代码而不刷新页面。

请帮忙。

1 个答案:

答案 0 :(得分:0)

在现有的JavaScript代码中,您可以添加以下内容:

document.getElementById("Fees_amt").appendChild(document.createTextNode('' + total));

另一方面,从某个输入字段中有人输入字符的意义上讲,您当前的代码并不是很棒,因此运行整个计算功能。虽然代码有效,但我建议添加一个按钮,一旦将值输入到输入字段中,用户就可以单击该按钮。虽然需要更多用户输入,但我认为这是一种更清晰的组织代码的方式。

根据进一步说明进行修改 如果你想要total_6total_5的总和最简单的方法(同时保持你当前的JavaScript结构将维护两个全局JavaScript变量中的值。这将看起来像这样:

<script>
   var total5 = 0,
       total6 = 0;

   function calculateTotal(pid){
      var amt=document.getElementById('amt_'+pid).value;
      var dis=document.getElementById('dis_'+pid).value;
      if(amt != "" && dis != ""){
        var total = (amt-((dis*amt)/100));
      }
      else if(amt != "" && dis == ""){
        var total = amt;
      }
     else{
       var total = "";
     }
     document.getElementById('total_'+pid).value=total;
     if(pid==5){
         total5 = total;
     } else{
         total6 = total
     }
     document.getElementById("Fees_amt").appendChild(document.createTextNode(total6 + total5));
  }   

虽然这应该有效但我强烈建议您重新考虑处理此问题的方式。