javascript - 小数点太多 + 网站上看不到样式

标签 javascript colors styling decimal

我下面的脚本在返回值中显示了太多的小数点

另外,当我将代码发布到我的网站上时,它没有显示我添加的所有文本样式

你能告诉我我缺少什么吗?

谢谢

<html>

    <head>
    <style>
            body {color:rgb(128,128,128);}
            p.3 {color:rgb(128,128,128);}
            p.3 {font-size:20PX;}
    </style>

    <script type = "text/javascript">

    function convert() {
        var Amount=document.getElementById('amount');
        var Currency=document.getElementById('currency');
        var Converted=document.getElementById('converted');
        var Choice=document.getElementById('choice');
        var AED=1;
        var US=0.27;
        var QR=0.99;
        var SR=1.02;
        var KD=0.0778;
        var BD=0.102;

        switch(document.converter.currency.value) {
            case "US Dollars" :
                document.converter.converted.value=US*document.converter.amount.value;
                document.converter.choice.value=document.converter.currency.value;
            break;
            case "Qatar Riyal":
                document.converter.converted.value=QR*document.converter.amount.value;
                document.converter.choice.value=document.converter.currency.value;
            break;
            case "Saudi Riyal":
                document.converter.converted.value=SR*document.converter.amount.value;
                document.converter.choice.value=document.converter.currency.value;
            break;
            case "Kuwaiti Dinar":
                document.converter.converted.value=KD*document.converter.amount.value;
                document.converter.choice.value=document.converter.currency.value;
            break;
            case "Bahrain Dinar":
                document.converter.converted.value=BD*document.converter.amount.value;
                document.converter.choice.value=document.converter.currency.value;
            break;
        }
    }
    </script>

    </head>

    <body>
        <div id="divWrapper">
        <form name="converter" id="converter">
        <br/> Enter amount in UAE Dirhams
        <input name="amount"type="text" id="amount" size="3" />
        <br /><br /> 
        Please Select a currency <select name="currency" id="currency">
        <option>Select one</option>
        <option value="US Dollars">US Dollars</option>
        <option value="Qatar Riyal">Qatar Riyal</option>
        <option value="Saudi Riyal">Saudi Riyal</option>
        <option value="Kuwaiti Dinar">Kuwaiti Dinar</option>
        <option value="Bahrain Dinar">Bahrain Dinar</option>
        </select> 

        <input type="button" name="convt" id="convt" onclick="convert()" value="Convert" />
        <br /><br /> 
        <p class="3"> The amount is:
        <input name="converted" type="text" id="converted" style="border:0px" style="color:rgb(255,0,102)" style="text-align:center" style="font-size:22PX"  value="" size="5"/>
        in 
        <input name="choice" type="text" id="choice" style="border:0px" style="color:rgb(255,0,102)" style="font-size:22PX" style="text-align:center" value="" size="10"> </p>

        <br /><br />
        </form>
        </div>
    </body>

</html>

最佳答案

关于 Javascript/Decimals

假设您希望四舍五入到小数点后两位,您应该使用.toFixed() 函数,如tschulze提到。

以下是如何将其合并到您当前的结构中(您必须对每个案例陈述执行类似的操作):

document.converter.converted.value=(BD*document.converter.amount.value).toFixed(2);
document.converter.choice.value=document.converter.currency.value;

关于样式

您在样式方面遇到的问题是由于具有多个样式属性。应用多种样式的正确方法是将您要设置的所有不同方面都放在一个样式属性中,并用分号分隔:

<input name="converted" type="text" id="converted" style="border:0; color:rgb(255,0,102); text-align:center; font-size:22PX;" value="" size="5"/>

附加说明

看起来你真的可以通过切换到一个结构来简化你的代码,在这个结构中你有一个单一的集合乘法器,并且只需根据它适合的情况选择应用哪个:

function convert() {
    var Amount=document.getElementById('amount');
    var Currency=document.getElementById('currency');
    var Converted=document.getElementById('converted');
    var Choice=document.getElementById('choice');
    var multiplier=1;

    switch(document.converter.currency.value) {
        case "US Dollars" : multiplier=0.27; break;
        case "Qatar Riyal": multiplier=0.99; break;
        case "Saudi Riyal": multiplier=1.02; break;
        case "Kuwaiti Dinar": multiplier=0.0778; break;
        case "Bahrain Dinar": multiplier=0.102; break;
    }
    
     document.converter.converted.value=(multiplier*document.converter.amount.value).toFixed(2);
     document.converter.choice.value=document.converter.currency.value;
}

关于javascript - 小数点太多 + 网站上看不到样式,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/16215133/

相关文章:

javascript - React-Redux : Insert Data in DB

android - 如何在 ActionBarSherlock 的标题上设置 shadowColor?

javascript - 将文本字段元素添加到 div 的样式

controls - OpenLayers - 重新定位缩放和平移控件

html - 尝试在样式中插入 typescript 元素时出现术语预期错误

javascript - 使用 select2 将 php 数组转换为 javascript 数组

javascript - AngularJS 架构尚未注册型号 'Post'

javascript - MVC3 从 Javascript 调用 Controller 方法

c++ - 如何插入颜色序列?

c++ - OpenCV 只返回红色形状图像