js怎么設置四舍五入保留兩位小數點
網站開辟經常會有這么一個需求：將計較成果四舍五入保留兩位小數點！接下來您將和小編一路進修若何完當作這一需求（注：例子只是為了便利演示！可以按照本身的需求來點竄）
東西/原料
- 電腦
- web開辟編纂器
方式/步調
- 1
打開我們的網頁開辟編纂器新建一個HTML網頁文件
- 2
編寫HTML demo(例子)代碼：
<div id="demo">
<p>產物單價：<em>1.86</em></p>
<p>采辦數目：<input type="number" id="text" /></p>
<p><input type="button" id="btn" value="提交"/></p>
<p>輸出的值是：<em id="result"></em></p>
</div>
- 3
編寫JS代碼：1.給提交按鈕綁心猿意馬點擊事務
代碼：document.getElementById("btn").onclick=function(){}
- 4
編寫JS代碼：2.獲取產物單價并轉化當作數字類型
代碼：var price = Number(document.getElementById("price").innerText);
- 5
編寫JS代碼：3.獲取采辦數目輸入框的值并轉化當作數字類型
代碼：var num = Number(document.getElementById("text").value);
- 6
編寫JS代碼：4.計較總價
代碼：var result = price * num;
- 7
編寫JS代碼：5.四舍五入保留兩位小數,然后將成果顯示到ID#result標簽上
document.getElementById("result").innerHTML=result.toFixed(2);
- 8
用瀏覽器打開我們編寫的頁面測試成果：
完整代碼：
<body>
<div id="demo">
<p>產物單價：<em id="price">1.86</em></p>
<p>采辦數目：<input type="number" id="text" /></p>
<p><input type="button" id="btn" value="提交"/></p>
<p>輸出的值是：<em id="result"></em></p>
</div>
</body>
<script type="text/javascript">
// 為提交按鈕添加點擊事務
document.getElementById("btn").onclick=function(){
// 獲取產物單價并轉化當作數字類型
var price = Number(document.getElementById("price").innerText);
// 獲取采辦數目輸入框的值并轉化當作數字類型
var num = Number(document.getElementById("text").value);
// 計較總價
var result = price * num;
//四舍五入保留兩位小數,然后將成果顯示到ID#result標簽上
document.getElementById("result").innerHTML=result.toFixed(2);
}
</script>
- 發表于 2019-08-15 20:01
- 閱讀 ( 1215 )
- 分類：其他類型
0 篇文章
作家榜 ?
-
xiaonan123
189 文章
-
湯依妹兒
97 文章
-
luogf229
46 文章
-
jy02406749
45 文章
-
小凡
34 文章
-
Daisy萌
32 文章
-
我的QQ3117863681
24 文章
-
華志健
23 文章