总体思路:设置一个循环事件,在事件中设置一个变量,变量递增,每次根据变量更改长度以及数字,到100结束循环即可
html代码:
<div class="progress">
<div class="progress-bar" role="progressbar" aria-valuenow="0" aria-valuemin="0" aria-valuemax="100" style="width: 0%;">
0%
</div>
</div>
js代码:
<script>
let num = 0;
function up(){
num++;
if(num>100){
clearInterval(lt);
}else{
$(".progress-bar").css("width",num+"%");
$(".progress-bar").text(num+"%");
}
}
let lt = setInterval("up()",500);
</script>
注意:别忘了引入bootstrap与jquery