36

我正在制作一个用于分发的 JS/PHP 插件。我希望它像这样易于安装：

<HTML>
<HEAD>
<TITLE>Testing my Plugin</TITLE>
<?php
  include 'path/to/myPlugin.php';
  echo getMyPluginHeadContent();
?>
</HEAD>
<BODY>
<?php
  echo getMyPluginContent("Arguments will go here");
?>
</BODY>
</HTML>

但是，我希望这个插件在不覆盖的情况下附加一个窗口调整大小的侦听器window.onresize，以防有任何其他脚本也需要使用该方法。有没有类似的javascript命令document.addEventListener("resize", myResizeMethod, true);？我知道不是这样，因为那行不通，而且 MDN 和 W3C 对参数的含义非常模糊addEventListener。

我不想要一个告诉我使用window.onresize = myResizeMethodor的答案<BODY ONRESIZE="myResizeMethod">，因为它们对插件不友好。

4

2 回答 2

75

由于您试图在调整窗口大小时调用此函数，因此您需要将该函数绑定到窗口而不是文档。要支持低于 9 的 IE 版本，您需要使用attachEvent. 请注意，这attachEvent需要您指定on关键字。这是一个例子：

if(window.attachEvent) {
    window.attachEvent('onresize', function() {
        alert('attachEvent - resize');
    });
}
else if(window.addEventListener) {
    window.addEventListener('resize', function() {
        console.log('addEventListener - resize');
    }, true);
}
else {
    //The browser does not support Javascript event binding
}

同样，您可以以相同的方式删除事件。使用时removeEventListener，请确保传递与useCapture调用时相同的值addEventListener。这是第三个参数，即true/false值。

if(window.detachEvent) {
    window.detachEvent('onresize', theFunction);
}
else if(window.removeEventListener) {
    window.removeEventListener('resize', theFunction, true);
}
else {
    //The browser does not support Javascript event binding
}
于 2012-11-30T19:03:08.397 回答
31

您不会调整文档的大小，而是调整窗口的大小。这有效：

window.addEventListener("resize", function(){console.log('resize!')}, true);
于 2012-11-30T18:53:32.967 回答