簡體   English   中英

改善$(document).ready和$(window).resize並使其更緊湊

[英]improve $(document).ready and $( window ).resize and make it more compact

我有這個代碼例如

var Wwin = $(window).width()

if ( Wwin > 2000 ) { 
    alert ('yes')
} else {    
    alert ('no')    
}

我需要每次$(document).ready$( window ).resize都運行此代碼

例如

$( window ).resize(function() {

    var Wwin = $(window).width()

    if ( Wwin > 2000 ) { 
        alert ('yes')
    } else {    
        alert ('no')    
    }

});

$(document).ready(function() {

    var Wwin = $(window).width()

    if ( Wwin > 2000 ) { 
        alert ('yes')
    } else {    
        alert ('no')    
    }

});

有什么方法可以改進此代碼並使它更緊湊?

例如

var $MyFunction =  (   var Wwin = $(window).width()
                       if ( Wwin > 2000 ) { 
                            alert ('yes')
                       } else { 
                            alert ('no')    
                       }  )

$( window ).resize(function() {

     $MyFunction

}); 

$(document).ready(function() {

     $MyFunction

});

要么

$(document).ready(function(){} & $( window ).resize(function() {

         $MyFunction

});

你有什么建議?

您可以隨時執行功能。

var windowSize = function () {
    if ( $(window).width() > 2000 ) { 
        alert('yes')
    } else {    
        alert('no')    
    }
}
$(document).ready(windowSize);
$(window).resize(windowSize);

但是請記住,調整大小事件將被多次觸發。

我建議:

var $MyFunction = function(){alert ($(window).width() > 2000?'yes':'no')};
$( window ).resize($MyFunction); 
$(document).ready($MyFunction);
var resizeHandler = function () {
    if ( $(window).width() > 2000 ) alert('yes');
    else alert('no');
}

$(function() {
    resizeHandler();
    $(window).resize(resizeHandler);
});

我進行了修改,我認為這是您需要的答案。

var $windowSize = function () {
    if ( $(window).width() > 2000 ) { 
        alert('yes')
    } else {    
        alert('no')    
    }
}
$(document).on('ready',$windowSize);
$(window).on('resize',$windowSize);

為什么要使用on()
使用$(document).on('ready', function(){});更有意義$(document).on('ready', function(){}); $(window).on('resize', function(){});

您只需要創建一個函數並在加載時調用它,然后將其綁定到窗口調整大小事件即可。

var resizeView = function () {
    if ( $(window).width() > 2000 ) {
        alert('yes');
    } else {
        alert('no')
    }
}

$(document).ready(function() {
    resizeView();
    $(window).resize(resizeView );
});

暫無
暫無

聲明:本站的技術帖子網頁,遵循CC BY-SA 4.0協議,如果您需要轉載,請注明本站網址或者原文地址。任何問題請咨詢:yoyou2525@163.com.

 
粵ICP備18138465號  © 2020-2024 STACKOOM.COM