首页
学习
活动
专区
工具
TVP
发布
社区首页 >问答首页 >我怎样才能使我的总数和税金四舍五入到小数点后两位?

我怎样才能使我的总数和税金四舍五入到小数点后两位?
EN

Stack Overflow用户
提问于 2018-12-20 02:09:17
回答 2查看 78关注 0票数 0

当我只是放入一个数量时,一切都像它应该的那样工作,并将.values舍入到2位小数,但当我在下拉选择器中选择一个选项时,它不再将.value显示为2位小数。当选择了机翼计数的选项时,是否有人可以帮助我使Tax和Total的值显示两个小数位?

我已经尝试将.toFixed(2)添加到total中,并在脚本的update()函数中添加tax.value

代码语言:javascript
复制
<table>
<tr style="background-color:black; color:white" >
    <th>Menu Item</th>
    <th>Quantity</th>
    <th>Price</th>
    <th>Preferance</th>
</tr>
<tr>
    <td>Boneless Chicken Wings</td>
    <td><input type="text" value="" name="QTY" id="QTY" onKeyUp="multiply()" /></td>
    <td><input type="text" name="PPRICE" id="PPRICE" value="5.99" disabled="disabled" readonly/></td>
    </td>
    <td>
        <form action="/action_page.php">
            <select id="BONELESS_COUNT" onkeyup="update()" onchange="update()">
            <option value="0.00" name="4PCBL" id="4PCBL">4 Piece $5.99</option>
            <option value="2.00" name="6PCBL" id="6PCBL">6 Piece $7.99</option>
            <option value="4.00" name="12PCBL" id="12PCBL">12 Piece $9.99</option>
            </select>
            <select name="Preparation">
            <option value="Baked">Baked</option>
            <option value="Fried">Fried</option>
            </select>
            <select name="Flavor">
            <option>Original</option>
            <option>Buffalo</option>
            <option>Parmesian</option>
            <option>Lemon Pepper</option>
            <option>BBQ</option>
            </select>

        </form>
    </td>
</tr>
    <tr>
    <td></td>
    <td><input type="text" name="4PCBLM" id="4PCBLM" value="1" disabled="disabled" style="display:none"readonly/></td>
    <td><input type="text" name="6PCBLM" id="6PCBLM" value="1" disabled="disabled" style="display:none"readonly/></td>
    <td><input type="text" name="12PCBLM" id="12PCBLM" value="1" disabled="disabled" style="display:none"readonly/></td>
    <td><input type="text" name="TAXDIV" id="TAXDIV" value="100" disabled="disabled" style="display:none"readonly/></td>
</tr>
<tr>
    <td></td>
    <td align="right"><strong>Subtotal $</strong></td>
    <td><input type="text" name="SUBTOTAL" id="SUBTOTAL"></td>
    <td></td>
</tr>
<tr>
    <td></td>
    <td align="right" style="display:none"><strong>Salestax</strong></td>
    <td><input type="text"name="SALESTAX" id="SALESTAX" value="11" disabled="disabled"  style="display:none" readonly/></td>
    <td></td>
</tr>
<tr>
    <td></td>
    <td align="right"><strong>Tax $</strong></td>
    <td><input type="text" name="TAX" id="TAX" /></td>
    <td></td>
</tr>
    <td></td>
    <td></td>
<tr>     
    <td></td>
    <td align="right"><strong>Total $</strong></td>
    <td><input type="text" name="TOTAL" id="TOTAL"></td>
    <td></td>
</tr>

代码语言:javascript
复制
function multiply() {
    a = Number(document.getElementById('QTY').value);
    b = Number(document.getElementById('PPRICE').value);
    c = Number(document.getElementById('4PCBL').value);
    d = Number(document.getElementById('4PCBLM').value);
    e = Number(document.getElementById('6PCBL').value);
    f = Number(document.getElementById('6PCBLM').value);
    g = Number(document.getElementById('12PCBL').value);
    h = Number(document.getElementById('12PCBLM').value);

    i = a * b;
    j = Number(document.getElementById('SALESTAX').value);
    k = i * j;
    l = Number(document.getElementById('TAXDIV').value);
    m = k / l;
    n = i + m;


    document.getElementById('SUBTOTAL').value = i.toFixed(2);
    document.getElementById('TAX').value = m.toFixed(2);
    document.getElementById('TOTAL').value = n.toFixed(2);
}

function update() {
  var pprice    = document.getElementById("PPRICE")
  var subtotal  = document.getElementById("SUBTOTAL")
  var tax       = document.getElementById("TAX")
  var total  = document.getElementById("TOTAL")
  qty    = document.getElementById("QTY")
  choice = document.getElementById("BONELESS_COUNT")
  pprice.value = b + (choice.options[choice.selectedIndex].value * QTY.value)
  subtotal.value = i + (choice.options[choice.selectedIndex].value * QTY.value)
  tax.value = (subtotal.value * j) / l
  total.value = (b + (choice.options[choice.selectedIndex].value * QTY.value)) * j / l + (b + (choice.options[choice.selectedIndex].value * QTY.value))
}
EN

回答 2

Stack Overflow用户

发布于 2018-12-20 02:37:51

看起来你忘了在你的更新函数中使用.toFixed(2)

代码语言:javascript
复制
tax.value = ((subtotal.value * j) / l).toFixed(2)
total.value = ((b + (choice.options[choice.selectedIndex].value * QTY.value)) * j / l + (b + (choice.options[choice.selectedIndex].value * QTY.value))).toFixed(2)
票数 0
EN

Stack Overflow用户

发布于 2018-12-20 03:33:25

你可以极大地简化你的代码,就是这样。请注意,为变量指定正确的名称,而不是"a,b,c..“让事情变得更容易理解,并在你试图找出事情不起作用的原因时会对你有很大帮助。

此外,您确实希望使用let (如果值稍后可能会更改)或const (如果值永远不会更改)来声明变量。请注意,每次调用update()时,都会重新创建其中的const变量,因为它们的作用域是在函数内部。它们持有的值在函数中永远不会改变,因此它们可以是const

如果不使用letconst,您将创建全局变量,这将给您带来很多问题。

代码语言:javascript
复制
// I am prepending $ to variable names to remind me that these are HTML elements
const $qty = document.getElementById("QTY");
const $choice = document.getElementById("BONELESS_COUNT");
const $subtotal = document.getElementById("SUBTOTAL");
const $pprice = document.getElementById("PPRICE");
const $tax = document.getElementById("TAX");
const $total = document.getElementById("TOTAL");

const salesTaxRate = Number(document.getElementById("SALESTAX").value) / 100;

function update() {
  const qty = Number($qty.value);
  const meal_price = Number($choice.options[$choice.selectedIndex].value);
  const subtotal = qty * meal_price;
  const tax = subtotal * salesTaxRate;
  const total = subtotal + tax;

  $subtotal.value = subtotal.toFixed(2);
  $pprice.value = subtotal.toFixed(2);
  $tax.value = tax.toFixed(2);
  $total.value = total.toFixed(2);
}
代码语言:javascript
复制
<table>
  <tr style="background-color:black; color:white">
    <th>Menu Item</th>
    <th>Quantity</th>
    <th>Price</th>
    <th>Preference</th>
  </tr>
  <tr>
    <td>Boneless Chicken Wings</td>
    <td><input type="text" value="" name="QTY" id="QTY" onKeyUp="update()" /></td>
    <td><input type="text" name="PPRICE" id="PPRICE" value="" disabled="disabled" readonly/></td>
    </td>
    <td>
      <form action="/action_page.php">
        <select id="BONELESS_COUNT" onkeyup="update()" onchange="update()">
          <option value="5.99" name="4PCBL" id="4PCBL">4 Piece $5.99</option>
          <option value="7.99" name="6PCBL" id="6PCBL">6 Piece $7.99</option>
          <option value="9.99" name="12PCBL" id="12PCBL">12 Piece $9.99</option>
        </select>
        <select name="Preparation">
          <option value="Baked">Baked</option>
          <option value="Fried">Fried</option>
        </select>
        <select name="Flavor">
          <option>Original</option>
          <option>Buffalo</option>
          <option>Parmesian</option>
          <option>Lemon Pepper</option>
          <option>BBQ</option>
        </select>
      </form>
    </td>
  </tr>
  <tr>
    <!-- not sure what this is for? -->
    <td></td>
    <td><input type="text" name="4PCBLM" id="4PCBLM" value="1" disabled="disabled" style="display:none" readonly/></td>
    <td><input type="text" name="6PCBLM" id="6PCBLM" value="1" disabled="disabled" style="display:none" readonly/></td>
    <td><input type="text" name="12PCBLM" id="12PCBLM" value="1" disabled="disabled" style="display:none" readonly/></td>
  </tr>
  <tr>
    <td></td>
    <td align="right"><strong>Subtotal $</strong></td>
    <td><input type="text" name="SUBTOTAL" id="SUBTOTAL"></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td align="right" style="display:none"><strong>Salestax</strong></td>
    <!-- you could just put this directly in your code -->
    <td><input type="text" name="SALESTAX" id="SALESTAX" value="11" disabled="disabled" style="display:none" readonly/></td>
    <td></td>
  </tr>
  <tr>
    <td></td>
    <td align="right"><strong>Tax $</strong></td>
    <td><input type="text" name="TAX" id="TAX" /></td>
    <td></td>
  </tr>
  <td></td>
  <td></td>
  <tr>
    <td></td>
    <td align="right"><strong>Total $</strong></td>
    <td><input type="text" name="TOTAL" id="TOTAL"></td>
    <td></td>
  </tr>

票数 0
EN
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接:

https://stackoverflow.com/questions/53856968

复制
相关文章

相似问题

领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档