2016-07-01 3 views
1

DOM onclickハンドラに渡されるパラメータは何ですか?パラメータの解決方法/ DOM onclickハンドラの実行コンテキストとは何ですか?DOM onclickハンドラパラメータ/実行コンテキスト

このjsbin(jsbin 1は非常に良いではないとして、ブラウザのdevのコンソールを使用)、または以下のコードを参照してください:

<!-- Remove the id="someid" and see what happpens --> 
<input type="text" id="someid" onclick="clickHandler(this,event,someid)'"/> 

<script> 
    function clickHandler() { 
     console.log(arugments); 
    } 
</script> 

参照

MDN DOM on-event handlers

追加の詳細を

I DOMでイベントをアタッチすることはお勧めできません。しかし、このテクニックは従来のアプリケーションでは引き続き使用されており、ハンドラーを 'this'パラメーターに渡すこと以外の文書は見つかりません。

+3

ですから、ここで何を求めているが?インラインイベントハンドラにある引数は明確に渡され、単なる関数なので、必要なものを渡すことができます。 'someid'がなぜ要素を指しているのか混乱していますか?もしそうなら、IDを持つ要素が要素への参照としてグローバル' window.someid'に追加されているからです。 – adeneo

+0

@adeneoああ、私はそれがグローバルな文脈であることを混乱させていました。そして、Idを持つ要素が同じID名でウィンドウオブジェクトに追加されたことが分かりませんでした。 Idを持つ要素がウィンドウオブジェクトに追加されたことを示すドキュメントを指摘できますか? – ksrb

+0

http://stackoverflow.com/questions/3434278/do-dom-tree-elements-with-ids-become-global-variables – adeneo

答えて

1

これは混乱し、HTML属性にバインドされたハンドラがどういうわけか別の実行コンテキストを持っていると考えた場合です。

ハンドラは、引き続きグローバルスコープ/ウィンドウオブジェクトで実行されます。したがって、期待されるように、関数内のイベントオブジェクトはwindow.eventオブジェクトを参照し、someidオブジェクトはwindow.someidを参照します。

<input type='text' id='someid' 
onclick=" 
    clickHandler(this, 
       event, //window.event 
       someid)" //window.someid'/> 

ユニークなIDを持つ要素のためのウィンドウオブジェクトの自動作成、質問のコメントで指摘されたの、私は知らなかった何かが表示されます。

Do DOM tree elements with ids become global variables?

関連する問題