2

JavaScript の初心者は、

addEventListener()

関数、の使用とは対照的に

variable.onclick

これが私がテストしているコードです

    /*
     * A simple function to swap the text of two elements        
     */
     function swapFunction(){
        var siteTitle   = document.getElementById("site_title");
        var siteText    = document.getElementById("site_text");

        var temp            = siteTitle.innerHTML;
        siteTitle.innerHTML = siteText.innerHTML;           
        siteText.innerHTML  = temp;
        return false;
     } 

     /*
      * A function to handle the page load
      */
     function fullyLoaded(){            
        var testEvent =       document.getElementById("test_click");            

        /* 
         * Why does the line that has been commented out not work
         * Yet the line beneath it does?
         */

        //testEvent.addEventListener("click", swapFunction(), false);
        testEvent.onclick = swapFunction;
    }

    window.onload = fullyLoaded;

HTML

<html>
<head>
<title>This is a test application</title>
</head>
<body>
<h1 id="site_title">Welcome To My Site</h1>
<p id="site_text">This is a test site that I am practicing on</p>
<a id="test_click" href="#">test click</a>
</body>
</html>

IE のイベント ハンドラと addEventListener() または attachEvent() の概念を説明してください。

前もって感謝します

4

2 に答える 2

4

変化する

testEvent.addEventListener("click", swapFunction(), false);

に

testEvent.addEventListener("click", swapFunction, false);

関数名の後に中かっこ () を記述すると、すぐに実行されますが、関数を引数として渡したいからです。中括弧を使用する場合、関数を渡すのではなく、その戻り値を渡します。

JS学習頑張ってください！

于 2013-07-17T22:44:33.653 に答える
1

このonclickメソッドは、DOM 2 Events に置き換えられた古い API に基づいています。これは、常に優れた MDN で言及されています。

addEventListener() は、DOM 2 Events 仕様で導入されました。それ以前は、イベント リスナーは次のように登録されていました。

// Pass a function reference — do not add '()' after it, which would call the function!
el.onclick = modifyText;

以下のコメント行は、swapFunctionすぐに呼び出している (つまり、関数自体ではなく ,の結果を送信している) ため、機能しません。swapFunctionこれは正しい構文です。

testEvent.addEventListener("click", swapFunction, false);

    // 「swapFunction()」ではなく「swapFunction」

于 2013-07-17T22:45:20.450 に答える