Question

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

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

(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 ready函数，你拥有的只是一个IIFE，然后在resize上附加一个实际的事件处理程序，并触发事件在pageload上触发它：

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

jQuery（noconflict模式）立即运行函数然后再次调整大小

1 个答案: