如何将进度条宽度显示为小数？

Question

Hi I have this working java script progress bar which shows progress bar as int. 嗨，我有这个工作的Java脚本进度条，它显示进度条为int。 I want to display the result of percentage as decimal?I have searched a lot in google and stack overflow didn't get what I want. 我想将百分比结果显示为十进制？我在Google中搜索了很多内容，但堆栈溢出未得到我想要的结果。

 <html> <head> <style> #myProgress { width: 100%; background-color: #ddd; } #myBar { width: 0%; height: 30px; background-color: #4CAF50; text-align: center; line-height: 30px; color: white; } </style> </head> <body> <h1>JavaScript Progress Bar</h1> <div id="myProgress"> <div id="myBar">0%</div> </div> <button onclick="move()">Click Me</button> <script> function move() { var elem = document.getElementById("myBar"); var width = 0; var id = setInterval(frame, 10); function frame() { if (width >= 10) { clearInterval(id); } else { width++; elem.style.width = width + '%'; elem.innerHTML = width *1 + '%'; //want this result as decimal } } } </script> </body> </html>

Answer 1

There you go, buddy. 哥们，你去了。 Change the JS as follows (and read the comments): 如下更改JS（并阅读注释）：

 function move() { var elem = document.getElementById("myBar"); var width = 0; var id = setInterval(frame, 1); //change the setInterval from 10ms to 1ms, or whatever value you want to make it faster/slower function frame() { if (width >= 10) { clearInterval(id); } else { width += 0.1; //change the increment value to 0.1 instead of 1 width = Math.round(width * 10) / 10; // round to nearest decimal elem.style.width = width + '%'; elem.innerHTML = width + '%'; } } }

如何将进度条宽度显示为小数？

问题描述

1 个解决方案

解决方案1
0 已采纳 2018-09-08 20:28:14

如何将进度条宽度显示为小数？

问题描述

1 个解决方案

解决方案1 0 已采纳 2018-09-08 20:28:14

解决方案1
0 已采纳 2018-09-08 20:28:14