Question

我没有重复调整大小页面的所有代码，而是尝试了这个：

$(document).ready(myfunction);
$(window).resize(myfunction);

function myfunction() {
    // do whatever
}

我遇到了一些问题。我有一些事情需要在页面加载时（总是相同的）和需要调整大小的事情发生。我的页面设置如下：

jQuery(document).ready(function($) {

    //a bunch of static stuff here

    $wall.imagesLoaded(function(){
       //using an imagesloaded plugin
       //masonry is here & needs to reload on resize.
    });

});

我在某处读到了总是将jQuery放在Wordpress的开头，所以我想我也可以，因为它有效。我如何摆动其余部分，以便Masonry重新加载窗口大小调整？

谢谢！

编辑解决方案：这适用于Wordpress。

    (function($) {

    $(document).ready(documentReadyFunction);
    $(window).resize(windowResizeFunction);

    function documentReadyFunction() {
        // functions for document ready
        onPageLoadOrResize();
        onPageLoad();
    }

    function windowResizeFunction() {
        // functions for window resize
        onPageLoadOrResize();
    }

    function onPageLoad() {
        alert("pageload");
    }


    function onPageLoadOrResize () {
        alert ("Load or Resize");
    }

    })(jQuery);

Answer 1

尝试使用这样的模式：

$(document).ready(documentReadyFunction);
$(window).resize(windowResizeFunction);

function documentReadyFunction() {
    genericStuffFunction()
    // do whatever for document ready
}

function windowResizeFunction() {
    genericStuffFunction()
    // do whatever for window resize
}

function genericStuffFunction() {
    // do whatever for document ready and window resize
}

Answer 2

或者，您可以让myFunction接受ev（事件）参数，然后检查ev.type属性以查看它是否为resize并相应地运行代码，像这样：

$(document).ready(myfunction);
$(window).resize(myfunction);

function myfunction(ev, ui) {
    if (ev.type && ev.type == 'resize') {
        alert('resize');
    }

    // do main stuff here...
}

jsFiddle example

Wordpress中的jQuery文档.ready和.resize

2 个答案: