6

forループの使い方を探しましsetTimeOutたが、whileループの使い方はあまり多くなく、とにかく大きな違いがあるのか​​わかりません。次のコードのバリエーションをいくつか作成しましたが、このループはブラウザをクラッシュさせるようです。

while(src == '')
{ 
    (function(){
        setTimeout(function(){
        src = $('#currentImage').val();
        $("#img_"+imgIdx).attr('src',src);
        }, 500);
     });
}

なんで？

基本的に、ソース属性の読み込みに時間がかかることがある動的に作成された画像があるため、表示する前に、画像が読み込まれているかどうかを確認し、パスがで使用可能な場合にのみ$('#currentImage')表示する必要があります。

このコードは、whileループを使用する前、および直接実行したときに正常に機能しました。

setTimeout(function(){
    src = $('#currentImage').val();
    $("#img_"+imgIdx).attr('src',src);
}, 3000);

ただし、読み込みが速くなる可能性がある場合は、ユーザーを3秒間待たせたくないのでsetTimeOut、whileループを設定して間隔を短くし、読み込みされたパスを0.5秒ごとにチェックするようにしました。それのどこが悪いんだい？

4

3 に答える 3

10

jrdnが指摘しているように、whileループが問題を引き起こしています。おそらく、setIntervalとsetTimeoutの両方を組み合わせて、srcがいっぱいになったら、間隔をクリアすることができます。役立つサンプルコードをここに配置しましたが、それがあなたの目標に完全に適合するかどうかはわかりません。

    var src = '';
    var intervalId = window.setInterval(
        function () {

            if (src == '') {
                setTimeout(function () {
                    //src = $('#currentImage').val();
                    //$("#img_" + imgIdx).attr('src', src);
                    src = 'filled';
                    console.log('Changing source...');
                    clearInterval(intervalId);
                }, 500);
            }
            console.log('on interval...');
        }, 100);

    console.log('stopped checking.');

お役に立てれば。

于 2012-10-21T09:21:56.593 に答える
5

問題はおそらく、0.5秒ごとにチェックしていないことです。

setTimeoutは、関数が将来実行されるようにスケジュールしますが、ブロックせず、後で実行するだけです。したがって、whileループでは、これらの関数がwhileループを反復処理できるのと同じ速さで実行されるようにスケジュールしているので、おそらく大量の関数を作成していることになります。

実際に0.5秒ごとにチェックする場合は、代わりにループなしでsetIntervalを使用してください。

于 2012-10-21T08:32:03.373 に答える
5

みんなに感謝します-すべての提案が役に立ちました。最後に、次のようにsetIntervalを使用しました。

var timer;
// code generating dynamic image index and doing ajax, etc
var checker = function() {
    var src = $('#currentImage').val();
    if(src !== '') {
    $('#img_' + imgIdx).attr('src', src);
        clearInterval(timer);
    }
};

timer = setInterval(checker, 500);
于 2012-10-21T09:26:26.970 に答える