click eventListenerに関する問題

文書の任意の場所をクリックすると、ページに警告を表示するタスク例が見つかりました。このタスクでは、myFuncとmyObjの2つのパラメータを持つdisplay（）関数のみを編集して、personオブジェクトの名前を表示する必要があります。私はこのようなことを思いついたが、警告はページが更新された後にのみ表示され、ドキュメントをクリックするたびに表示されるというわけではない。ここclick eventListenerに関する問題

function start() { 
    var person = { 
        name : "John" 
    }; 
    function alertName() { 
        alert(""+this.name.toUpperCase() + ""); 
    } 
    document.addEventListener('click', display(alertName, person)); 
} 
function display(myFunc, myObj) { 
    name = myObj.name; 
    myFunc(); 

} 
start();

はフィドルです：

function start() { 
 
    var person = { 
 
        name : "John" 
 
    }; 
 
    function alertName() { 
 
        alert(""+this.name.toUpperCase() + ""); 
 
    } 
 
    document.addEventListener('click', start(alertName, person)); 
 
} 
 
function display(myFunc, myObj) { 
 
    name = myObj.name; 
 
    myFunc(); 
 

 
} 
 
start();

body { 
 
    background-color:yellow; 
 
}

<body> 
 

 
    </body>

出典

2017-08-30 hetious

これはイベントリスナーの仕組みではありません。コールバックのパラメータを選択する必要はありません。さらに、このようにすると、引数を含めるため、イベントlistener_を宣言した時点で関数が実行されます。関数に_referenceを渡す必要があります。技術的に何をしているのかは、display（）function_の_resultをコールバック引数として渡すことです。その関数は何も返さないので意味がありません。あなたが存在しない関数を呼び出し、ここのサンプルと一致しないので、あなたのフィドルは機能しません。投稿前にあなたのものをチェックしてください:-) – ADyson

そこにjqueryはありません - あなたはjqueryまたはjavascriptを単独で使うつもりでしたか？ –

あなたはdisplayは関数であり、display(alertName, person)によってあなたはすぐにそれを呼び出している、いないイベントコールバックとしてあることを理解する必要があります。しかし、addEventListenerは、第2パラメータとして関数参照を必要とするので、display(alertName, person)が呼び出されたときに、内部からalertName（参照）を呼び出す新しい関数を返す必要があることを意味します。

最後に、alertNameの内部には、myObjというコンテキストで呼び出す必要があることが示されています。Function.prototype.callを使用してください。

function start() { 
 
    var person = {         
 
    name: "John"     
 
    } 
 
    
 
    function alertName() {         
 
    alert("" + this.name.toUpperCase() + "");     
 
    } 
 
    
 
    document.addEventListener('click', display(alertName, person)); 
 
} 
 

 
function display(myFunc, myObj) { 
 
    return function() { 
 
    myFunc.call(myObj) 
 
    } 
 
} 
 
start();

Click somewhere.

出典

2017-08-30 11:48:01 dfsq

私は初心者です、私はちょうど学びています。ご回答有難うございます – hetious

問題ここでそのaddEventListenerを2番目のパラメータでは、イベントがトリガされたときに呼び出したい関数にする必要があります。

あなたの例では、関数ではなく命令を渡しました。あなたができることは、関数本体の中にdisplay（）呼び出しを追加し、その関数を2番目のパラメータとして渡すことです：

function start() { 
    var person = { 
        name : "John" 
    }; 
    function alertName() { 
        alert(""+this.name.toUpperCase() + ""); 
    } 
    document.addEventListener('click', function() { 
    display(alertName, person) 
    }); 
} 
function display(myFunc, myObj) { 
    name = myObj.name; 
    myFunc(); 

} 
start();

出典

2017-08-30 11:50:14 RogerC

click eventListenerに関する問題

答えて

関連する問題