如何在JavaScript中附加窗口調整大小事件偵聽器？

我正在製作一個用於分發的JS/PHP插件。我想這是因爲易於安裝，因爲這：如何在JavaScript中附加窗口調整大小事件偵聽器？

<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，萬一有一些還需要使用的任何其他腳本該方法。 有沒有像document.addEventListener("resize", myResizeMethod, true);這樣的javascript命令？我知道不是這樣，因爲這不起作用，MDN和W3C對於addEventListener採取什麼論點很模糊。

我不想要一個答案告訴我使用window.onresize = myResizeMethod或<BODY ONRESIZE="myResizeMethod">，因爲它們不像插件友好。

來源

2012-11-30 Supuhstar

既然你正試圖把它添加到窗口，你嘗試過'window.addEventListener'？ – Kyle

幾乎任何。對 = 可以變成一個閱讀進度（，） – bhamlin

@bhamlin：有見地的評論，謝謝。 –

由於您試圖在調整窗口大小時調用此函數，因此您需要將函數綁定到窗口而不是文檔。要支持小於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 
}

同樣，你可以刪除事件以同樣的方式

if(window.detachEvent) { 
    window.detachEvent('onresize', theFunction); 
} 
else if(window.removeEventListener) { 
    window.removeEventListener('resize', theFunction); 
} 
else { 
    //The browser does not support Javascript event binding 
}

來源

2012-11-30 19:03:08 Kyle

+1比我的更完整的答案。 –

除了忘記'';'在你的示例代碼中，這是完美的！謝謝！ – Supuhstar

@Supuhstar糟糕，修復了代碼。很高興你能夠得到它的工作。 – Kyle

您不調整文檔大小，而是調整窗口大小。這個工作原理：

window.addEventListener("resize", function(){console.log('resize!')}, true);

來源

2012-11-30 18:53:32

作爲一個補充，你會想要使用'attachEvent'版本的IE <9. – Kyle

@Kyle我不知道（我的網站不是IE8兼容或基於jQuery的）。隨意構建自己的答案。我在你的評論中看到你對窗口和文檔也知道。 –

謝謝。我會用一個例子在一分鐘內發表一個答案。 – Kyle

如何在JavaScript中附加窗口調整大小事件偵聽器？

回答

相關問題