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

2025-10-10 00:22:37

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位小数

声明:本网站引用、摘录或转载内容仅供网站访问者交流或参考,不代表本站立场,如存在版权或非法内容,请联系站长删除,联系邮箱:site.kefu@qq.com。
猜你喜欢