0

これは私のコードです:

<html>
<head>
    <script type="text/javascript" language="javascript">
        function load() {
            div1 = document.getElementById('div1');
            div2 = document.getElementById('div2');
            function clicky() {
                alert('1');
            }
            div2.addEventListener('click', clicky);
            //div1.innerHTML += 'ooooooofdsfdsfdsfdsfdsfsdfdsfdsfdsfdsklfdsjfkldsjfkldsjfldsjfkldsjfkldsjfdskl';
        }       
    </script>
</head>
<body onload="load();">
    <div id="div1" style="width : 300px; height : 300px; background-color : red; position : absolute">

        <div id="div2" style="width : 20px; height : 20px; background-color : green; position : absolute; right : 5px; top : 5px;">X</div>

    </div>
</body>

したがって、div1 に div2 があります。コメント化された文字列が実際にコメント化されている場合、すべてが機能します。div2 をクリックするとアラートが発生します。しかし、div1.innerHTML に smth を追加すると、イベント ハンドラーが機能しません。問題はどこだ？

4

1 に答える 1

1

あなたのコード

div1.innerHTML += 'ooooooofdsfdsfdsfdsfdsfsdfdsfdsfdsfdsklfdsjfkldsjfkldsjfldsjfkldsjfkldsjfdskl';

実際に意味する

div1.innerHTML = div1.innerHTML + ooooooofdsfdsfdsfdsfdsfsdfdsfdsfdsfdsklfdsjfkldsjfkldsjfldsjfkldsjfkldsjfdskl';

したがって、文字通りの意味では、div1 の innerHTML を新しい文字列で上書きし、それによって div2 の新しいオブジェクトが作成されます。したがって、innerHTML が設定された後にクリック リスナーを追加する必要があります。

于 2013-04-06T10:14:49.760 に答える