jsinput输出的值怎么设置2位小数

时间:2026-02-15 22:36:36

1、打开网站开发工具新建HTML一个页面

jsinput输出的值怎么设置2位小数

2、编写(例子)HTML标签代码:

<div id="demo">

<input type="number" id="text" />

<input type="button" id="btn" value="提交"/>

输出的值是:<em id="result"></em>

</div>

jsinput输出的值怎么设置2位小数

3、编写(例子)JavaScript脚本代码:1.为提交按钮添加点击事件:

document.getElementById("btn").onclick=function(){}

jsinput输出的值怎么设置2位小数

4、编写(例子)JavaScript脚本代码:2.获取input输入框的数值:

var num = document.getElementById("text").value

jsinput输出的值怎么设置2位小数

5、编写(例子)JavaScript脚本代码:3.讲输入框的值转化成数字类型:

var result = Number(num);

jsinput输出的值怎么设置2位小数

6、编写(例子)JavaScript脚本代码:3.四舍五入保留两位小数,然后将结果显示到#result标签上:

document.getElementById("result").innerHTML=result.toFixed(2);

jsinput输出的值怎么设置2位小数

7、用浏览器打开页面,在输入框输入输入数值,然后点击提交按钮,进行测试!

完整代码:

<body>

<!-- 例子 -->

<div id="demo">

<input type="number" id="text" />

<input type="button" id="btn" value="提交"/>

输出的值是:<em id="result"></em>

</div>

<script type="text/javascript">

// 为提交按钮添加点击事件

document.getElementById("btn").onclick=function(){

var num = document.getElementById("text").value;//获取input输入框的值

var result = Number(num);//将文本输入框的值转化成数字类型

//四舍五入保留两位小数,然后将结果显示到#result标签上

document.getElementById("result").innerHTML=result.toFixed(2);

}

</script>

</body>

jsinput输出的值怎么设置2位小数

8、如果你不想使用四舍五入,只想保留两位小数可以这么做:Math.floor(result * 100)

完整代码:

<body>

<!-- 例子 -->

<div id="demo">

<input type="number" id="text" />

<input type="button" id="btn" value="提交"/>

输出的值是:<em id="result"></em>

</div>

<script type="text/javascript">

// 为提交按钮添加点击事件

document.getElementById("btn").onclick=function(){

var num = document.getElementById("text").value;//获取input输入框的值

var result = Number(num);//将文本输入框的值转化成数字类型

document.getElementById("result").innerHTML=Math.floor(result * 100) / 100 

}

</script>

</body>

jsinput输出的值怎么设置2位小数

© 2026 五度知识库
信息来自网络 所有数据仅供参考
有疑问请联系站长 site.kefu@gmail.com