我已经在窗口调整大小上注册了一个触发器。我想知道如何触发要调用的事件。例如,当隐藏一个 div 时,我希望我的触发器函数被调用。
我发现window.resizeTo()
可以触发该功能,但还有其他解决方案吗?
我已经在窗口调整大小上注册了一个触发器。我想知道如何触发要调用的事件。例如,当隐藏一个 div 时,我希望我的触发器函数被调用。
我发现window.resizeTo()
可以触发该功能,但还有其他解决方案吗?
window.dispatchEvent(new Event('resize'));
在可能的情况下,我更喜欢调用函数而不是调度事件。如果您可以控制要运行的代码,这很有效,但请参阅下文了解您不拥有代码的情况。
window.onresize = doALoadOfStuff;
function doALoadOfStuff() {
//do a load of stuff
}
在此示例中,您可以在doALoadOfStuff
不分派事件的情况下调用该函数。
在现代浏览器中,您可以使用以下方法触发事件:
window.dispatchEvent(new Event('resize'));
这在 Internet Explorer 中不起作用,您必须在其中进行常规操作:
var resizeEvent = window.document.createEvent('UIEvents');
resizeEvent.initUIEvent('resize', true, false, window, 0);
window.dispatchEvent(resizeEvent);
jQuery 有trigger
方法,它的工作原理是这样的:
$(window).trigger('resize');
并有警告:
尽管
.trigger()
模拟事件激活并带有合成的事件对象,但它并不能完美地复制自然发生的事件。
您还可以模拟特定元素上的事件...
function simulateClick(id) {
var event = new MouseEvent('click', {
'view': window,
'bubbles': true,
'cancelable': true
});
var elem = document.getElementById(id);
return elem.dispatchEvent(event);
}
使用 jQuery,您可以尝试调用trigger:
$(window).trigger('resize');
结合 pomber 和 avetisk 的答案来覆盖所有浏览器并且不会引起警告:
if (typeof(Event) === 'function') {
// modern browsers
window.dispatchEvent(new Event('resize'));
} else {
// for IE and other old browsers
// causes deprecation warning on modern browsers
var evt = window.document.createEvent('UIEvents');
evt.initUIEvent('resize', true, false, window, 0);
window.dispatchEvent(evt);
}
一个也适用于 IE 的纯 JS(来自@Manfred 评论)
var evt = window.document.createEvent('UIEvents');
evt.initUIEvent('resize', true, false, window, 0);
window.dispatchEvent(evt);
或者对于角度:
$timeout(function() {
var evt = $window.document.createEvent('UIEvents');
evt.initUIEvent('resize', true, false, $window, 0);
$window.dispatchEvent(evt);
});