6

IE 8 でスタック オーバーフロー エラーを引き起こす単純な機能があります。IE 7 または 6 をテストしていませんが、他のブラウザでは問題は発生していないようです。

正確なエラーは次のとおりです。 

 SCRIPT28: Out of stack space 
 jquery.min.js, line 2 character 7498
 SCRIPT2343: Stack overflow at line: 2

問題の機能：

function switchImage(size, objid, prefix, fullimage){

    if(size !== 'full'){
        var image = prefix + size + '/' + size +'_' + fullimage;
    }
    else {
        var image = prefix + size + '/' + fullimage;
    }

    $('#' + objid).data('type', size)
        .append('<img id="preload" src="' + image + '" style="display:none;" />')
            .find('#preload').load(function(){
                $('#' + objid).find('img').attr('src', image);
                $(this).remove();
            });
}

ユースケースの概要を説明するために、この関数の目的を説明します。

ユーザーが (jqueryUI resize を使用して) 画像のサイズを変更すると、幅/高さが別の関数で比較されます。

画像が特定のサイズになると、この関数が呼び出され、ご覧のとおり<img>、画像の高解像度バージョンの 'src' 属性を使用して隠し要素を DOM に追加します (画像がユーザーによる小型化。

読み込まれると、可視要素の src 属性が更新され、非表示要素が削除されます。

これにより、ユーザーがプロセス全体で画質を維持しながらサイズを変更する際に、画像の優れた動的切り替えが証明されました....

IE 8 で問題の原因を特定できないようです。この関数を削除してもエラーは発生しません。エラーは存在しますが、関数は正常に機能します (ただし、IE 8 ではサイズ変更のパフォーマンスが低下します)。 ）。

どんな助けでも大歓迎です。

更新:関数を次のように書き直すことで、元の問題を解決したようです:-

function switchImage(size, objid, prefix, fullimage){

    var $el = $('#' + objid);

    if(size !== 'full'){
        var image = prefix + size + '/' + size +'_' + fullimage;
    }
    else {
        var image = prefix + size + '/' + fullimage;
    }

    $el.data('type', size);

    $('<img id="preload" src="' + image + '" style="display:none;" />')
        .appendTo($el)
            .one('load', function(){
                $('#' + objid).find('img').attr('src', image);
                    $(this).remove();
                });
}

ご覧のとおり、唯一の実際の違いは、.append() ではなく .appendTo() を使用していることと、jQuery .one() メソッドを使用して load イベントが 1 回だけ発生するようにしている点です。要素はその後すぐに削除されるため、なぜこれが違いを生むのかわかりません。

将来このような問題を回避する方法を学ぶことができるように、誰かがこれに光を当てることができるかどうかを知りたいと思います. 乾杯。

4

1 に答える 1