4

onresize イベントがブラウザーでいつ終了するかを検出しようとしています。「onresize」イベントを使用すると、Firefox ではサイズ変更イベントが終了した後に 1 回だけ発生するように見えます。これはまさに私が望んでいることです。しかし、IE で試してみると、サイズ変更中に「onresize」イベントが何度も発生します。

MSDN で宣伝されている「onresizeend」イベントも試してみます。しかし、FFでもIEでも、まったく起動しないようです。次のコードを使用します。

<html>
    <head>
        <script>
        <!--
        function doLog(message)
        {
            document.getElementById("log").innerHTML += "<br/>" + message;
        }

        function doResize()
        {
            doLog("plain resize");
        }

        function doResizeEnd()
        {
            doLog("resize end");
        }
        -->
        </script>
        <style>
        <!--
        #log {
            width: 400px;
            height: 600px;
            overflow: auto;
            border: 1px solid black;
        }
        -->
        </style>
    </head>
    <body onresize="doResize();" onresizeend="doResizeEnd();">
        <div id="log"/>
    </body>
</html>

これが機能しない理由はありますか？「onresizeend」イベントがサポートされていない可能性がありますか? この場合、サイズ変更イベントが終了したことをどのように検出できますか?

ありがとう。

4

1 に答える 1

5

MSDN onresizeend()より

コントロールの選択に含めることができるのは、コンテンツの編集可能なオブジェクトのみです。contentEditable プロパティを true に設定するか、親ドキュメントをデザイン モードにすることで、オブジェクトのコンテンツを編集可能にできます。

それがあなたのために発砲しない理由を説明しています。contentEditable を有効にしたくないのではないかと思うので、タイマーを設定してみませんか。

var resizeTimer = 0;
function doResize()
{
    if (resizeTimer)
        clearTimeout(resizeTimer);

    resizeTimer = setTimeout(doResizeEnd, 500);
}

完璧ではありませんが、うまくいけば十分です。

于 2008-11-10T12:59:15.407 に答える