如何使用原生JavaScript触发窗口大小改变事件？

Question

我正在尝试使用纯JS触发resize事件进行测试，但是现代浏览器会阻止window.resizeTo() 和 window.resizeBy()这些操作触发事件。我尝试了jquery的$(window).trigger('resize'); ，但只能触发通过jquery附加的事件，例如$(window).on('resize', handler);。然而在我的情况下，我正在使用纯javascript的项目。

示例

window.addEventListener('resize', function(){
    console.log('window has been resized !');
});

// or even using global onresize
window.onresize = function() {
    console.log('window has been resized!');
};

- Mohamed Hassan

---

如果您的事件监听器是一个命名函数，您可以直接调用该函数（假设它不需要使用 event 对象）。 - nnnnnn

Answer 1

您很可能因为人们认为这是一个重复的问题而被 downvote，但是从 as a duplicate 和 you might not need jquery website 看来：

IE9+

触发本地

// For a full list of event types: https://developer.mozilla.org/en-US/docs/Web/API/document.createEvent
var el = document; // This can be your element on which to trigger the event
var event = document.createEvent('HTMLEvents');
event.initEvent('resize', true, false);
el.dispatchEvent(event);

触发自定义

var el = document; // This can be your element on which to trigger the event
if (window.CustomEvent) {
  var event = new CustomEvent('my-event', {detail: {some: 'data'}});
} else {
  var event = document.createEvent('CustomEvent');
  event.initCustomEvent('my-event', true, true, {some: 'data'});
}

el.dispatchEvent(event);

- bitten

---

对于想要触发调整大小事件的人，请在调用 initEvent 时使用 resize，而不是 change。 - Marius Kjeldahl

"el" 从哪里来的？ - dshukertjr

无论事件附加到何处。它可以是window或dom元素。 - bitten