在網(wǎng)站開發(fā)中，經(jīng)常會(huì)遇到需要將計(jì)算結(jié)果四舍五入并保留兩位小數(shù)點(diǎn)的需求。下面我們一起學(xué)習(xí)如何實(shí)現(xiàn)這個(gè)需求。 創(chuàng)建HTML頁(yè)面 首先，打開你的網(wǎng)頁(yè)開發(fā)編輯器，新建一個(gè)HTML網(wǎng)頁(yè)文件。然后編寫以下HT

在網(wǎng)站開發(fā)中，經(jīng)常會(huì)遇到需要將計(jì)算結(jié)果四舍五入并保留兩位小數(shù)點(diǎn)的需求。下面我們一起學(xué)習(xí)如何實(shí)現(xiàn)這個(gè)需求。

創(chuàng)建HTML頁(yè)面

首先，打開你的網(wǎng)頁(yè)開發(fā)編輯器，新建一個(gè)HTML網(wǎng)頁(yè)文件。然后編寫以下HTML代碼：

lt;div id"demo"gt;
    lt;pgt;產(chǎn)品單價(jià)：lt;emgt;1.86lt;/emgt;lt;/pgt;
    lt;pgt;購(gòu)買數(shù)量：lt;input type"number" id"text"/gt;lt;/pgt;
    lt;pgt;lt;input type"button" id"btn" value"提交"/gt;lt;/pgt;
    lt;pgt;輸出的值是：lt;em id"result"gt;lt;/emgt;lt;/pgt;
lt;/divgt;

編寫JavaScript代碼

接下來，我們需要編寫一些JavaScript代碼來實(shí)現(xiàn)四舍五入保留兩位小數(shù)點(diǎn)的功能。

首先，給提交按鈕綁定點(diǎn)擊事件：

("btn").onclick  function() {
    // 獲取產(chǎn)品單價(jià)并轉(zhuǎn)化成數(shù)字類型
    var price  Number(("price").innerText);
    // 獲取購(gòu)買數(shù)量輸入框的值并轉(zhuǎn)化成數(shù)字類型
    var num  Number(("text").value);
    // 計(jì)算總價(jià)
    var result  price * num;
    // 四舍五入保留兩位小數(shù)，并將結(jié)果顯示到ID為result的標(biāo)簽上
    ("result").innerHTML  (2);
}

測(cè)試結(jié)果

最后，在瀏覽器中打開我們編寫的頁(yè)面，可以輸入產(chǎn)品數(shù)量并點(diǎn)擊提交按鈕，頁(yè)面將會(huì)顯示計(jì)算結(jié)果并四舍五入保留兩位小數(shù)。