Javascript addEventListenerがサイズ変更を読み取らない

-1

こんにちは私はあなたのサイズを変更するときにブラウザの幅と高さでh1タグを追加するeventListenerを追加しようとしています。なぜそれが動作していないのか分かりません。Javascript addEventListenerがサイズ変更を読み取らない

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title>Window size</title> 
 

 

 
</head> 
 

 

 
<body> 
 

 
<div id="wh"></div> 
 

 
<script type="text/javascript"> 
 

 
"use strict"; 
 

 
document.addEventListener("onresize", function(){ 
 

 
\t var width = document.documentElement.clientWidth; 
 
\t var height = document.documentElement.clientHeight; 
 

 
\t document.getElementById('wh').innerHTML = "<h1>Width: " + width + " Height: " + height + "</h1>"; 
 

 
}); 
 

 

 
</script> 
 

 

 
</body> 
 
</html>

出典

2016-07-04 Muffin

window.addEventListener（ "resize"、... – dmoo

^^ + 'document'は' resize'をトリガしませんt、 'window'のみです。 – Teemu

'window.addEventListener（ 'resize'、func）' – gcampbell

あなたは間違ったイベントを持っている、それは単に 'サイズを変更' する必要があります。さらに例についてはこちらを参照してください - http://www.w3schools.com/jsref/event_onresize.asp

<!DOCTYPE html> 
 
<html> 
 
<head> 
 
\t <title>Window size</title> 
 

 

 
</head> 
 

 

 
<body> 
 

 
<div id="wh"></div> 
 

 
<script type="text/javascript"> 
 

 
"use strict"; 
 

 
window.addEventListener("resize", function(){ 
 

 
\t var width = document.documentElement.clientWidth; 
 
\t var height = document.documentElement.clientHeight; 
 

 
\t document.getElementById('wh').innerHTML = "<h1>Width: " + width + " Height: " + height + "</h1>"; 
 

 
}); 
 

 

 
</script> 
 

 

 
</body> 
 
</html>

出典

2016-07-04 15:09:43 dmoo

を使用してください。すばらしいヘルプのおかげで、私はちょうどJavaスクリプトを学習しています。ドキュメントとウィンドウの違いは何ですか？ – Muffin

Stackoverflowはすべてを知っており、ここで私が今までよりもはるかに優れている - http://stackoverflow.com/questions/9895202/what-is-the-difference-between-window-screen-and-document-in-javascript – dmoo

あなたはdocument.addEventListenerに

代わり

window.onresize = function(event) { 
    var width = document.documentElement.clientWidth; 
    var height = document.documentElement.clientHeight; 

    document.getElementById('wh').innerHTML = "<h1>Width: " + width + " Height: " + height + "</h1>"; 
};

を使用することができますし、それ以外の場合は、 "サイズを変更" ではなく "さらにonResize"

イベントです

出典

2016-07-04 15:10:58

Javascript addEventListenerがサイズ変更を読み取らない

答えて

関連する問題