Javascript 同一页面上有多个js进度条?
我正在使用progressbar.js进行一个项目,我希望在我的页面上有多个进度条。有一个动态量,所以我不知道提前多少进度条,我将在页面上 我只是复制了代码,并给了第二个progressbar一个.progress2类。理想情况下,我想让progressbar为每个元素工作,只需给它一个.progress类 显然,我想我应该先收集这些值,然后把它们放到一个数组中,但我甚至不能让它工作。有人能给我一个正确的方向,因为我不太擅长javascript 如果有人能看一看,告诉我这是否能按我所希望的方式完成,我将不胜感激。晚上,斯蒂芬 我想这就是你想要的: 看到了吗?没什么大不了的!:-)Javascript 同一页面上有多个js进度条?,javascript,jquery,arrays,oop,progress-bar,Javascript,Jquery,Arrays,Oop,Progress Bar,我正在使用progressbar.js进行一个项目,我希望在我的页面上有多个进度条。有一个动态量,所以我不知道提前多少进度条,我将在页面上 我只是复制了代码,并给了第二个progressbar一个.progress2类。理想情况下,我想让progressbar为每个元素工作,只需给它一个.progress类 显然,我想我应该先收集这些值,然后把它们放到一个数组中,但我甚至不能让它工作。有人能给我一个正确的方向,因为我不太擅长javascript 如果有人能看一看,告诉我这是否能按我所希望的方式
注:我相信,这是可以改进的。你是我的英雄:)这么简单,却又这么有效。不客气,下次你不会被卡住,这才是最重要的!:)
var circle = new ProgressBar.Circle('.progress', {
color: startColor,
easing: 'linear',
strokeWidth: 8,
duration: 1500,
text: {
value: '0'
}
});
$('.progress').each(function() {
var circle = new ProgressBar.Circle(this, {
color: startColor,
easing: 'linear',
strokeWidth: 8,
duration: 1500,
text: {
value: '0'
}
});
var value = ($(this).attr('value') / 100);
circle.animate(value, {
from: {
color: startColor
},
to: {
color: endColor
},
step: function(state, circle, bar) {
circle.path.setAttribute('stroke', state.color);
console.log(circle);
circle.setText((circle.value() * 100).toFixed(0));
}
});
});