0

次の例を検討してください。

/**/
var sizes;

$(window).resize(function() {

    var viewportWidth = $(window).width();
    //var viewportHeight = $(window).height();
    if (viewportWidth > 1024) {
        sizes = '320';
    } else if (viewportWidth < 1024) {
        sizes = '300';
    }
}); /**/

jQuery(document).ready(function($) {
    console.log(sizes);
    $('#full_width_anything_slider').anythingSlider({
        delay: sizes
    });

});​

sizes他のメソッド内の var にアクセスするにはどうすればよいですか?

今はうまくいきません

ありがとう

4

4 に答える 4

2

sizesドキュメントの onReady 関数が実行されるとき、それに関連付けられた値はありません。実際、onResize 関数が実行されるまで値はありません。

于 2012-08-14T17:06:59.547 に答える
1

投稿されたコードが関数にラップされていない限り、宣言はグローバルです。

ただし、viewportWidth が正確に 1024 の場合、サイズは設定されません。resize が呼び出されるまで値を持たないので sizes、宣言時に値を設定し、ウィンドウのサイズが変更されたときにリセットします

var sizes = $(window).width() <= 1024 ? '300' : '320';
$(window).resize(function() {
    var viewportWidth = $(window).width();
    sizes = $(window).width() <= 1024 ? '300' : '320';
});

一般に、グローバル変数は悪い考えであることに注意してください。あなたの場合、あなたもそうするかもしれません

$(function() {
    $('#full_width_anything_slider').anythingSlider({
        delay: $(window).width() <= 1024 ? '300' : '320';
    });
});​

コードの最初の部分は、ドキュメントがロードされたときに anySlider に値が渡され、ウィンドウのサイズが変更されても変更されないため、使用している方法では実際には機能しないことに注意してください (参照ではなく値です) 。2番目の部分もこの問題を解決しませんが、以下のようにwindow.resizeでコードを繰り返すと

var setupSlider = function()
    $('#full_width_anything_slider').anythingSlider({
        delay: $(window).width() <= 1024 ? '300' : '320';
    });
});​
$(function(){
    setupSlider();
});
$(window).resize(setupSlider);
于 2012-08-14T17:07:37.257 に答える
1

グローバル変数を正しく宣言していますが、渡してanythingSliderいるのは値のスナップショットであり、その値を含む変数への参照ではありません。anythingSliderグローバル変数を変更しても、（サイズ変更時に）変更するたびに新しい値でanythingSliderを再初期化しない限り、遅延は変更されません

とにかくグローバルである必要はありません。

$(window).resize(function() {
    var sizes = '0';
    var viewportWidth = $(window).width();
    //var viewportHeight = $(window).height();
    if (viewportWidth >= 1024) {
        sizes = '320';
    } else if (viewportWidth < 1024) {
        sizes = '300';
    }
    $('#full_width_anything_slider').anythingSlider({
        delay: sizes
    });
});
$(document).ready(function(){
    $(window).trigger("resize");
});

ただし、このプラグインの再初期化またはオプションの変更に関するドキュメントが見つからないことに注意してください。これが再初期化の正しい方法であるかどうかはわかりません。

于 2012-08-14T17:11:50.870 に答える
0

これはあまり良い習慣ではありません...しかし：

/**/
$(window).resize(function() {
    updateSize();
}); /**/

function updateSize() {
    var viewportWidth = $(window).width();
    //var viewportHeight = $(window).height();
    if (viewportWidth > 1024) {
        sizes = '320';
    } else if (viewportWidth <= 1024) {
        sizes = '300';
    }
}    

jQuery(document).ready(function($) {
    updateSize();
    console.log(sizes);
    $('#full_width_anything_slider').anythingSlider({
        delay: sizes
    });

});​

後で同様にサイズを使用することになると思います (そして願っています)。

于 2012-08-14T17:06:39.123 に答える