1

私はいくつかのオーディオファイルでかなりプロセッサの重い処理を行っています。startProcessingというこの関数に入る前に、ページ全体をオーバーレイして計算を行うdivを表示したいと思います...問題は、関数が終了した後にのみdivが表示されることです。コードをアクティブにするボタンをクリックすると、ボタンがフリーズし、プロセス機能が終了した場合にのみ、フリーズを解除してローダーを表示します。誰かが同様の行動を見て、それを解決することができましたか？

document.getElementById('loader').innerHTML = "<p>Calculating...</p><p>Please Wait</p><img src='../img/loader.gif' />";
document.getElementById('loader').style.visibility = "visible";
document.getElementById('notification').style.visibility = "visible";

var speed = document.getElementById("playbackSpeed").value/100;


    console.log("Changing speed");
    if (speed > 1.5){
        startProcessing(1.5);   
        backend.playbackSpeed = 1.5;
    } else if (speed < 0.75){
        startProcessing(0.75);
        backend.playbackSpeed = 0.75;
    } else {
        startProcessing(speed);
        backend.playbackSpeed = speed;
    }
4

3 に答える 3

3

重い処理をWebワーカーに投げ込むことができます。それはあなたのUIを解放するでしょう。

注： IEに対応していません... IE10のみ（私は思います）

于 2012-12-06T19:56:00.850 に答える
1

少し遅れて重い計算を実行してみてください。

setTimeout(function(){
    var speed = document.getElementById("playbackSpeed").value/100;


    console.log("Changing speed");
    speed = Math.min(Math.max(speed, 0.75), 1.5);
    startProcessing(speed);
    backend.playbackSpeed = speed;
}, 13);
于 2012-12-06T19:54:15.290 に答える
0

1つのアプローチは、進行状況バーを表示するdivにsetTimeoutまたはsetIntervalを使用することです。それを回避する別の方法は、いくつかの（疑似）マルチスレッドを実行することです。

于 2012-12-06T19:57:41.350 に答える