jQuery（无冲突模式）立即运行函数，然后在调整大小时再次运行

Question

我正在为 WordPress 网站编写一个函数，遵循基于 WordPress Codex http://codex.wordpress.org/Function_Reference/wp_enqueue_script#jQuery_noConflict_Wrappers 的准则

这是我的脚本，我想立即执行，而不是等待 DOM 就绪事件：

(function($) {
    if ($('#wpadminbar').length > 0) {
        $('#menu').css('top', $('#wpadminbar').height()+'px');
            $('.pure-menu-link').css('top', $('#wpadminbar').height()+'px');
    }
})(jQuery);

现在我还想在调整屏幕大小时重新运行此功能，例如：

(function($) {
    if ($('#wpadminbar').length > 0) {
        $('#menu').css('top', $('#wpadminbar').height()+'px');
            $('.pure-menu-link').css('top', $('#wpadminbar').height()+'px');
    }
    $(window).resize(function($));
})(jQuery);

但显然这会引发语法错误。

我的问题是，我如何执行函数，然后在调整窗口大小时重新执行它？我需要一个循环吗？

Answer 1

使用 DOM 就绪函数，你所拥有的只是一个 IIFE，然后在调整大小时附加一个实际的事件处理程序，并在页面加载时触发事件来触发它：

jQuery(function($) {
    $(window).on('resize', function() {
        if ($('#wpadminbar').length) {
            $('#menu, .pure-menu-link').css('top', $('#wpadminbar').height());
        }
    }).trigger('resize');
});