jQuery 调整大小功能在页面加载时不起作用

发布于 2024-08-27 21:46:02 字数 105 浏览 8 评论 0原文

如何使该函数不仅在窗口大小调整时运行,而且在初始页面加载时运行?

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

How do I get this function to not only run on window resize but also on initial page load?

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

如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。

扫码二维码加入Web技术交流群

发布评论

需要 登录 才能够评论, 你可以免费 注册 一个本站的账号。

评论(5

乖乖兔^ω^ 2024-09-03 21:46:02

自 jQuery 3.0 起,此解决方案现已弃用:https://api.jquery。 com/bind/#bind-eventType-eventData-handler

您需要使用:

$(document).ready(function() { /* your code */ });

使某些事情在加载时发生。如果你想让某些东西在加载和调整大小时工作,你应该这样做:

onResize = function() { /* your code */ }

$(document).ready(onResize);

$(window).bind('resize', onResize);

This solution is now deprecated since jQuery 3.0: https://api.jquery.com/bind/#bind-eventType-eventData-handler

You'll want to use:

$(document).ready(function() { /* your code */ });

To make something happen onload. If you want something to work onload and onresize, you should do:

onResize = function() { /* your code */ }

$(document).ready(onResize);

$(window).bind('resize', onResize);
萌吟 2024-09-03 21:46:02

我认为最好的解决方案是将其绑定到加载和调整大小事件:

$(window).on('load resize', function () {
    // your code
});

I think the best solution is just to bind it to the load and resize event:

$(window).on('load resize', function () {
    // your code
});
薄情伤 2024-09-03 21:46:02

此行为是设计使然。

您应该将代码放入命名函数中,然后调用该函数。

例如:

function onResize() { ... }

$(onResize);
$(window).resize(onresize);

或者,您可以制作一个插件来自动绑定并执行处理程序:

$.fn.bindAndExec = function(eventNames, handler) {
    this.bind(eventNames, handler).each(handler);
};

$(window).bindAndExec('resize', function() { ... });

请注意,如果处理程序使用 event 对象,它将无法正常工作,并且它不会涵盖每个重载bind 方法的。

This behavior is by design.

You should put your code into a named function, then call the function.

For example:

function onResize() { ... }

$(onResize);
$(window).resize(onresize);

Alternatively, you can make a plugin to automatically bind and execute a handler:

$.fn.bindAndExec = function(eventNames, handler) {
    this.bind(eventNames, handler).each(handler);
};

$(window).bindAndExec('resize', function() { ... });

Note that it won't work correctly if the handler uses the event object, and that it doesn't cover every overload of the bind method.

℉絮湮 2024-09-03 21:46:02
$(document).ready(onResize);
$(window).bind('resize', onResize);

没有和我一起工作。

尝试

$(window).load('resize', onResize);
$(window).bind('resize', onResize);

一下。

(我知道这个问题已经很老了,但是谷歌将我发送到这里,所以......)

$(document).ready(onResize);
$(window).bind('resize', onResize);

didn't work with me.

Try

$(window).load('resize', onResize);
$(window).bind('resize', onResize);

instead.

(I know this question is old, but google sent me here, so...)

抱着落日 2024-09-03 21:46:02

另一种方法是,您可以简单地设置一个处理程序,然后自己欺骗一个调整大小事件:

// Bind resize event handler through some form or fashion
$(window).resize(function(){
  alert('Resized!');
});

// Trigger/spoof a 'resize' event manually
$(window).trigger('resize');

Another approach, you can simply setup a handler, and spoof a resize event yourself:

// Bind resize event handler through some form or fashion
$(window).resize(function(){
  alert('Resized!');
});

// Trigger/spoof a 'resize' event manually
$(window).trigger('resize');
~没有更多了~
我们使用 Cookies 和其他技术来定制您的体验包括您的登录状态等。通过阅读我们的 隐私政策 了解更多相关信息。 单击 接受 或继续使用网站,即表示您同意使用 Cookies 和您的相关数据。
原文