【问题标题】:Round value using selection of drop down menu / radio button使用下拉菜单/单选按钮选择舍入值
【发布时间】:2023-12-21 18:53:01
【问题描述】:

这包括两个问题。第一个问题是将数字四舍五入到某个小数点。第二个问题是将下拉菜单连接到右边的小数点。

首先是我的代码:

<style>
  span{font-style:italic;}
  span{color:green;}
</style>

<script>
    function calcul(){
            var sales = parseFloat(document.getElementById("sales").value);
            var OpExp = parseFloat(document.getElementById("OpExp").value);
            var TaxAll = parseFloat(document.getElementById("TaxAll").value);
            var Depre = parseFloat(document.getElementById("Depre").value);
            var Divid = parseFloat(document.getElementById("Divid").value);
            var TaxR = parseFloat(document.getElementById("TaxR").value);
            //GP = Gross Profit
            var GP = sales - OpExp;
            //TaxInc = Taxable Income
            var TaxInc = GP + TaxAll;
            //NetInc = Net Income
            var NetInc = TaxInc - ((TaxR / 100) * TaxInc);
            document.getElementById("NetIncome").innerHTML= 
            TaxInc - ((TaxR / 100) * TaxInc);
            //AtRE = Addition to Retained Earnings
            document.getElementById("AtRE").innerHTML = NetInc - Divid;
        }
</script>

<form action="" id="nothing">
In 2007 the British building firm Balfour Betty plc had sales of 
<input type="text" id="sales" maxlength="6" size="6"> 
million, total operating expenses of 
<input type="text" id="OpExp" maxlength="6" size="6"> 
million, a tax allowance (rebate) of 
<input type="text" id="TaxAll" maxlength="6" size="6"> 
million because of past losses, and 
<input type="text" id="Depre" maxlength="6" size="6"> 
depreciation. <strong>What is the net income of the
firm?</strong><br />
<br />
Balfour Betty plc paid out <input type="text" id="Divid" maxlength="6" size="6"> million 
in cash dividends. <strong>What is the addition to retained earnings?</strong><br />
<br />
The tax rate is <input type="text" id="TaxR"  maxlength="6" size="6"> %.<br />
<br />
  <input type="button" value="Calculate" id="but" onclick="calcul()" /><br />
<br />
</form>

<strong>The Net Income of Balfour Betty plc is </strong><span id="NetIncome">XXX</span>
<strong> million</strong><br />
<br />
<strong>The addition to retained earnings of Balfour Betty plc is </strong><span id="AtRE">
XXX</span><strong> million</strong>
<br />
<br />

第一个问题:四舍五入。以下答案:&lt;span id="NetIncome"&gt; 需要动态舍入。我尝试添加一个名为RNetInc 的新变量并添加以下等式RNetInc = NetInc.toFixed(4),但它只给了我两位小数,刷新后它甚至不再起作用。将答案四舍五入为 N 位小数的最佳方法是什么?

第二个问题是我不知道这是否可能。我想到的是以下内容: 下拉菜单

<select>
    <option value"1">1 decimal</option>
    <option value"2">2 decimals</option>
    <option value"3">3 decimals</option>
</select> 

所以,我想要的是当我单击N decimal 时,答案将变为 N 十进制。这是一个非常复杂的情况,但我经常需要它。

因为我只知道 Javascript 的(非常)基础知识,即使使用 Google 我也找不到答案。有人可以让我走上正确的轨道(如果可能的话)?提前致谢。

【问题讨论】:

    标签: javascript xhtml


    【解决方案1】:

    我建议只修复最终结果,toFixed() 返回一个字符串。

    select 的 HTML:

    <select id="dec">
        <option value="1">1 decimal</option>
        <option value="2">2 decimals</option>
        <option value="3">3 decimals</option>
    </select>
    

    calcul():

    var decs = +(document.getElementById('dec').value); // Add this line
    document.getElementById("NetIncome").innerHTML = (TaxInc - ((TaxR / 100) * TaxInc)).toFixed(decs);
    document.getElementById("AtRE").innerHTML = (NetInc - Divid).toFixed(decs);
    

    A live demo at jsFiddle(已更新)。

    编辑

    看来我部分误解了您的问题。请检查更新的小提琴,现在您还可以通过从select 中选择一个值来随时更改小数位数。

    【讨论】:

    • 上一个其实已经不错了,但是修改后的版本更好。它确实有效,但我有一个问题:我不太了解这段代码:var calculated = false; window.onload = function () { document.getElementById('dec').addEventListener('change', function () { if (calculated) calcul();}); }
    • @user2686401 if 阻止calcul()Calculate 按钮被点击至少一次之前执行。 calcul() 中有calculated=true。这称为标记。如果您将在calcul() 中创建验证系统,则可以删除标记。