parseFloat(String s) toFixed()应用详解

最新推荐文章于 2024-06-22 13:47:05 发布

king6603

最新推荐文章于 2024-06-22 13:47:05 发布

阅读量1.9w

点赞数 2

分类专栏： javaScript 文章标签： string input function xhtml html table

本文链接：https://blog.csdn.net/king6603/article/details/5928468

版权

javaScript 专栏收录该内容

2 篇文章 0 订阅

订阅专栏

parseFloat(String s)& toFixed()

语法

parseFloat() 将一个字符串转换成一个浮点数字

toFixed() 方法可把 Number 四舍五入为指定小数位数的数字

参数

parseFloat() 参数为待转换的字符串

toFixed() 规定小数的位数，是 0 ~ 20 之间的值，包括 0 和 20，有些实现可以支持更大的数值范围。如果省略了该参数，将用 0 代替

返回值

转换后的数字

经典案例

此函数可以将字符串转换成浮点数，网页中text框中输入的值，我们可以使用doucument.getElemenById(“id”).value 取到，但取到的值是字符串。有时候我们需要对取到的多个值做数学运算，此方法便可将字符串转化成数字。

需求描述：将下图中的各金额求和后，填充到合计框中,求和时机在各文本框失去焦点时。

代码如下：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312" /> <title>parseFloat</title> <mce:script type="text/javascript"></mce:script> </head> <body> <table width="100%"> <tr> <td width="36%" height="40" align="right" valign="middle">金钱1：</td> <td width="64%" height="40"> <input type="text" name="textfield" id="id1" οnblur="sumMoney();" value="0"/> </td> </tr> <tr> <td height="40" align="right" valign="middle">金钱2：</td> <td height="40"><input type="text" name="textfield2" id="id2" οnblur="sumMoney();" value="0"/></td> </tr> <tr> <td height="40" align="right" valign="middle">金钱3：</td> <td height="40"><input type="text" name="textfield3" id="id3" οnblur="sumMoney();" value="0"/></td> </tr> <tr> <td height="40" align="right" valign="middle">金钱4：</td> <td height="40"><input type="text" name="textfield4" id="id4" οnblur="sumMoney();" value="0"/></td> </tr> <tr> <td height="40" align="right" valign="middle">合计：</td> <td height="40"><span id="total">00.00</span></td> </tr> </table> </body> </html>

结果如图：

需求扩展：

现在需要把求得的和保留两位小数，那么需要使用toFiexd()函数处理结果，如图：

修改后的：sumMoney()

function sumMoney(){ var _money1 = document.getElementById("id1").value; var _money2 = document.getElementById("id2").value; var _money3 = document.getElementById("id3").value; var _money4 = document.getElementById("id4").value; var _total = (parseFloat(_money1) + parseFloat(_money2) + parseFloat(_money3) + parseFloat(_money4)).toFixed(2); var total = document.getElementById("total"); total.innerHTML = _total; }