0

したがって、このスクリプトには問題があります。基本的に、サイズ変更イベントでスクリプトをロードしています。

I have it working if lets say...
- User has window size above 768 (getScipt() and content by .load() in that script)
- Script will load (and content)
- User for some reason window size goes below 768 (css hides #div)
- User re-sizes again above 768, And does not load the script again! (css displays the div)

偉大な。正しく動作します。 

Now.. (for some cray reason)
- User has window size below 768 (Does NOT getScript() or nothing)
- User re-sizes above 768 and stops at any px (getScript and content)
- User re-sizes again anything above 768 (It getScript AGAIN)

スクリプトを一度だけ取得する必要があります。ここからいくつかのコードを使用しました

jQuery:その場でウィンドウ幅を検出する方法は?

（編集 - 私はこれを見つけました。彼はスクリプトを一度ロードするという同じ問題を抱えています。）

$(window).resize 内の関数の問題 - jQuery などを使用して、次へのリンクを失いました:/

この問題を最初に見つけたとき、このようなものを使用していたので、問題を解決するために allcheckWidth() を追加しました。しかし、そうではありません。

var $window = $(window);
function checkWidth() {
    var windowsize = $window.width();
////// LETS GET SOME THINGS IF IS DESKTOP 
var $desktop_load = 0;
    if (windowsize >= 768) {
    if (!$desktop_load) {

            // GET DESKTOP SCRIPT TO KEEP THINGS QUICK
            $.getScript("js/desktop.js", function() { 
            $desktop_load = 1;
    });

    } else {
    }
    }
////// LETS GET SOME THINGS IF IS MOBILE
    if (windowsize < 768) { 
    } 
}
checkWidth();

function allcheckWidth () {
var windowsize = $window.width();
//// IF WINDOW SIZE LOADS < 768 THEN CHANGES >= 768 LOAD ONCE
var $desktop_load = 0;
    if (!$desktop_load) {
    if (windowsize < 768) {
            if ( $(window).width() >= 768) { 

        $.getScript("js/desktop.js", function() { 
            $desktop_load = 1;
        });

            }
    }   
        }

}
$(window).resize(allcheckWidth);

今、このようなものを使用していますが、これはより理にかなっていますか?

$(function() {   
    $(window).resize(function() {
var $desktop_load = 0;
    //Dekstop
    if (window.innerWidth >= 768) {
    if (!$desktop_load) {
            // GET DESKTOP SCRIPT TO KEEP THINGS QUICK
            $.getScript("js/desktop.js", function() { 
            $desktop_load + 1;
    });
    } else {
    }
    }
if (window.innerWidth < 768) {
    if (window.innerWidth >= 768) {
    if (!$desktop_load) {
                // GET DESKTOP SCRIPT TO KEEP THINGS QUICK
                $.getScript("js/desktop.js", function() { 
        $desktop_load + 1;
        });
    } else {
        }
    }
    }
    }) .resize(); // trigger resize event
})

将来の対応のための Ty。

編集 - 例を挙げると、desktop.js には、.load() によって挿入される「abc」コンテンツの前に読み込まれる gif があります。サイズを変更すると、この gif が表示され、desktop.js の .load() が再び起動します。そのため、getScript が 1 回だけ呼び出された場合、desktop.js で再度何も実行することはありません。混乱しますか？

4

2 に答える 2

0

jQueryのドキュメントから私の答えをコピーします：

デフォルトで$.getScript()は、キャッシュ設定を false に設定します。これにより、タイムスタンプ付きのクエリ パラメータがリクエスト URL に追加され、リクエストされるたびにブラウザがスクリプトをダウンロードするようになります。を使用してキャッシュ プロパティをグローバルに設定することにより、この機能をオーバーライドできます。 $.ajaxSetup():

$.ajaxSetup({
  cache: true
});

取得したスクリプトをブラウザーにキャッシュさせる場合、問題にはなりませんが、既に取得したスクリプトをブラウザーが取得しないようにするには、フラグを設定するだけです。

$(function() {   
    var gotscript=false;
    $(window).resize(function() {
        if (window.innerWidth >= 768) {
            if (!gotscript) {
                $.getScript("js/desktop.js", function() { 
                    gotscript=true;
                });
            }
        }
        if (window.innerWidth < 768) {
            if (window.innerWidth >= 768) {
                if (!gotscript) {
                    $.getScript("js/desktop.js", function() { 
                        gotscript=true;
                    });
                }
            }
        }
    }).resize(); // trigger resize event
});

ご覧のとおり、フラグの初期状態はサイズ変更イベントの外側に設定する必要があります!

于 2012-07-09T02:28:54.157 に答える
0

というわけで、昨夜問題を解決しました。別の質問で答えました

こちらhttps://stackoverflow.com/a/11400128/1065573

于 2012-07-09T17:39:09.360 に答える