序文:私の個人的なサイトにdemo of the problemがあります(これは大丈夫ですが、そうでなければjsfiddleで設定しようと思います)。私はこの質問を少し楽しくなるようにしようとしていますが、また、JavaScriptの時間関数を理解しようとしています。setTimout関数を同じ速度で実行させるにはどうすればよいですか?
タイムアウト時にプログレスバーの値を増やしています。理想的には(関数が瞬間的に実行される場合)、それらは同じ速度で塗りつぶすべきですが、実際の世界ではそうではありません。このコードは次のとおりです。
function setProgress(bar, myPer) {
bar.progressbar({ value: myPer })
.children('.ui-progressbar-value')
.html(myPer.toPrecision(3) + '%')
.attr('align', 'center');
myPer++;
if(myPer == 100) { myPer = 0; }
}
function moveProgress(bar, myPer, inc, delay){
setProgress(bar, myPer);
if(myPer >= 100) { myPer = 0; }
setTimeout(function() { moveProgress(bar, myPer+inc, inc, delay); }, delay);
}
$(function() {
moveProgress($(".progressBar#bar1"), 0, 1, 500);
moveProgress($(".progressBar#bar2"), 0, 1, 500);
moveProgress($(".progressBar#bar3"), 0, .1, 50);
moveProgress($(".progressBar#bar4"), 0, .01, 5);
});
ネイティブに、同じスピードですべてを実行する必要があると思います。
しかし、最初の2つのバー(「プログレスバーの設定」を1回の操作と呼びます)では、500ミリ秒ごとに1回の操作を行い、合計500回の操作でバーを満たします。 3つ目は50ミリ秒ごとに1回の操作を行い、合計5,000回の操作でバーを埋めることです。 4回目には5msごとに1回の操作を実行しており、合計5万回の操作でバーを埋めることができます。
私のコードのどの部分が最も長くかかるのですか?これらのスピードの違いがあり、それらが機能するように変更することができます(4番目のバーは少しずつ増加します)。同じスピードですか?
私がこの権利を見ていると、サンプルサイトではラベルがオフになっています。 Isnt '4th bar .01 5msごとに? –
@JamesMontagne whoops。ありがとう。一定。 – xdumaine
'setTimeout'コールの遅延は最小値にクランプされることに注意してください。 html5ブラウザ(およびChrome)では4msですが、ブラウザによって異なります。すなわち、10msのようなより大きな値にクランプすることができる。 –