- ベストアンサー
JSのイベントターゲットの解説
b0a0aの回答
もう一度整理して書きますが その記事の「イベントターゲット」と「EventTargetクラス」と「EventTargetインターフェイス」は別物ですよ。 そして何より、「ANo.1」の「event.target」とは全く違います。 最もやりがちで、最もしては行けないミスです。
関連するQ&A
- イベントevt?evt.target:event.srcElement;の意味合い
以下の理解で合っているのでしょうか？ よくイベントの取得で エレメント.onclick = function(evt){ var e = evt?evt.target:event.srcElement; } でeにイベントオブジェクトの発生元要素をセットしているのを見かけますが、 これは、ブラウザーの違いの吸収なのでしょうか？ firefoxでは、イベントハンドラー関数にイベントオブジェクトが渡されるので、渡されたイベントオブジェクトよりevt.targetで発生元要素をセットし、一方IEでは、eventという名前のオブジェクトが存在している（？）ので、イベントハンドラー関数にイベントオブジェクトが渡されず、event.srcElementで発生元要素をセットする。 ※Opera、Safariは何でも良い IEの場合、後から、イベントが追加されたらeventオブジェクトはどうなるのでしょうか？ある要素の一つのイベントタイプには一つのイベントハンドラーしか定義できないのでしょうか？
- 締切済み
- JavaScript
- オブジェクトとイベントにつきまして
javascript超初心者です。。 今仮に、スクリプトの中でメソッド、プロパティ、イベントやイベントハンドラの前に、オブジェクトを入れるとします。(たとえば、window.aleart～など) その中でも、イベントやイベントハンドラをスクリプトの中に書くとして、ナビゲーターオブジェクトをその前に書く時、documentなのかwindowなのか、また他のオブジェクトなのか、使い分け方が分かりません。 大変稚拙な質問で申し訳ありませんが、javascriptの先輩方、どういうイベント(イベントハンドラ)の時にwindowで、どういうイベント(イベントハンドラ)の時にdocumentなのか等、ご回答頂けると本当に助かります。 どうぞよろしくお願い致します。
- 締切済み
- JavaScript
- イベントリスナを調べる方法についての質問です。
イベントリスナを調べる方法についての質問です。 現在twitterのページで使われているJavaScriptの挙動を分析しているのですが、コード量が非常に多く苦労しています。 ある要素にどのようなイベントリスナが追加されたか、または追加されているかということを調べるいい方法はないでしょうか？ addEventListenerで関数を登録した場合、element.onclickにセットされた関数を取得するというような方法が使えないので困っています。 bookmarkletやユーザースクリプト、アドオンなど何でもいいので、要素に追加されているイベントリスナを直接調べたり、あるいはイベントリスナが追加される瞬間を検出できるようないい方法があれば教えてください。 （解析はFirefox上で行っていますが、他のブラウザを使う方法でも構いません） 宜しくお願いします。
- 締切済み
- JavaScript
- イベントリスナーで読み込んだ後に、DOMで文字を表
イベントリスナーで読み込んだ後に、DOMで文字を表示させたい。 DOMを使って、文字を表示させるならイベントリスナーで読み込み必要があると思いました。 そこで、下記のように書いて試してみました。 function hoge(){ this.view = function(){ window.addEventListener( 'load',this.foo, false ); } this.foo =function(){ var txt = document.createTextNode( this.moji ); document.body.appendChild( txt ); } } var a =new hoge(); a.moji="テスト"; a.view(); すると、「undefined」と表示されます。 どうすればいいのでしょうか。よろしくお願いします。
- ベストアンサー
- JavaScript
- イベントリスナの削除
あるオブジェクトとそれ以外のいくつかのオブジェクトを含むドキュメントがあります。 そのドキュメント全体のうち、例えば、すべてのa要素に対して、clickイベントを追加したとします。 また、そのドキュメントのうち「あるオブジェクト」だけを非同期通信によって差し替えます。 この時、差し替えられる前の「あるオブジェクト」に登録されたイベントが残ったまま、新しいオブジェクトに差し替えられてしまいます。 これを何度も繰り返していくことで、UAは悲鳴を上げているようなのです。（具体的には、ページ内リンクを辛そうにしています） 解消するには、『「あるオブジェクト」だけを非同期通信によって差し替え』る直前に、「あるオブジェクト」に登録されたイベントをすべて破棄すればいいと思うのです。 ですが、登録されたイベントの一部は引数を与える必要があったため、 Obj.addEventListener(eType, (function(arg) { return function(event) { //こう書くと、argにaが、eventにイベントオブジェクトが渡される } })(a), false); このような記述をしており、関数名がありません。 そこで、あるオブジェクトに対して、登録されたイベントをすべて破棄する、良い方法があればご教授頂きたく、質問させていただきます。 よろしくお願いいたします。
- ベストアンサー
- JavaScript
- 循環参照とメモリリークに関して
次のスクリプトはメモリリークを起こしているでしょうか。 function process(listener){ return function(evt){ listener.call(evt.target,evt); }; } function addEvent(element,type,listener,useCapture){ element.addEventListener(element,type,process(listener),useCapture); } var div=document.getElementsByTagName('div')[0]; //存在するものとして addEvent(div,'click',function(){;},false); //いかにも起こしそう div.parentNode.removeChild(div); //親も存在するものとして 工夫してみたものの、やはりメモリリークするんでしょうか。 実際にaddEventListenerのlistener引数に渡されるのは、element変数を参照しない function(evt){ listener.call(evt.target,evt); }; ですが、listener変数は参照します。 そして、そのlistener変数はdiv変数(DOM)を参照するので、ここで循環するのでしょうか。 そして、以下の場合はどうなのでしょうか。。 var elements=[document.getElementsByTagName('div')[0]]; elements[0].addEventListener('click',function(){;},false); elements[0].parentNode.removeChild(elements[0]);
- ベストアンサー
- JavaScript
- jQuery の one 関数について
jQuery の one 関数は便利だと思い、是非作ってみようと思いましたが、全然出来ません＞＜ 一応以下のように作ってありますが、正しく動作しない上に、name を指定して、 Listener.data オブジェクトにname で保存をするようになっていて、同じnameを渡したら上書きされてしまいます。 どうしたら、jQueryのような、one関数を作れるでしょうか？；； var Listener={ addEvent:function(element,type,callback,useCapture){ if(element.addEventListener){ return element.addEventListener(type,callback,useCapture); } else if(element.attachEvent){ return element.attachEvent('on'+type,callback); } else{ return element['on'+type]=callback; } }, removeEvent:function(element,type,callback,useCapture){ if(element.removeEventListener){ element.removeEventListener(type,callback,useCapture); } else if(element.detachEvent){ element.detachEvent('on'+type,callback); } else{ return false; } return true; }, addOne:function(name,element,type,callback,useCapture){ Listener.addEvent(element,type,callback,useCapture); Listener.addEvent(element,type,function(){ Listener.removeEvent(element,type,); },useCapture); this.data[name]=new Function("Listener.removeEvent("+element+",'"+type+"',Listener.data['"+name+"'],"+useCapture+");+callback); this.addEvent(element,type,this.data[name],useCapture); }, data:{ } }; addEventとremoveEventは正常動作しています。 現在は、 Listener.addOne('name'/*指定しなくてもいいようにしたい*/,'document'/*オブジェクトを渡すと、elementがobjectになり、未定義エラーに*/,function(){alert('OK');},true); となっていますが、目指すは以下のような書き方です。 //仮関数定義 function test(str){ alert(str); } var str='test'; Listener.addOne(document,function(str){test(str);},true); です。 一応、jQueryのone関数を見てみましたが、jQueryは使ったことが無く、あまり分かりませんでした；； 御回答宜しくお願いしますm(_ _)m
- ベストアンサー
- JavaScript
- Androidイベントリスナ、イベントハンドラ違い
Androidににおける「イベントリスナ」「イベントハンドラ」の違いを教えてください ・イベントに対応するメソッドが、「View クラスのインターフェイス」「View クラス」に分かれている理由が分かりません ・なぜメソッドによって、「インターフェイス」にあったり、「クラス」にあったりするのでしょうか？ ・「onKeyDown」みたいにAndroid 自体が自動検知(？)するイベント対応メソッドは、「View クラス」に書かれる決まり？ ・「onClick」などのイベントは、リスナに登録しないと利用できないから(？)、「インターフェイス」に書いてある？ ・「イベントリスナ」は、「イベントハンドラ」の一種類なのでしょうか？ ▽6.5 UIイベントハンドリング - ソフトウェア技術ドキュメントを勝手に翻訳 https://sites.google.com/a/techdoctranslator.com/jp/android/guide/ui/ui-events#EventHandlers
- ベストアンサー
- Java
- JavaScript DOMについて
JavaScriptの勉強を始めて、１か月程度の初心者です。 JavaScriptを使って、計算したり、カレンダーを作ったり、 HTMLの要素の内容を変更させたり、削除したり、 スタイルシートのプロパティ？を変更して、背景色を変えたり、要素を移動したり、 イベントを使用したりと、出来ることは増えてきて、勉強するのが楽しくなってきたのですが、 いまだにDOM操作についていまいち理解できていません。 具体的にDOMとはどこからどこまでなんでしょうか？ JavaScriptに組み込まれているオブジェクト（Date,Math、String、Array） 以外のものは、すべてDOM操作と言う事でしょうか？ イベントハンドラだとか、タイマ機能？（windowオブジェクトのsetTimeout（）メソッド）なども DOMと言う事でしょうか？ どなたかわかりやすく説明してもらえると嬉しいです。
- ベストアンサー
- JavaScript
- Javascriptのオブジェクト指向プログラミングとイベント、thisの扱い
Javascriptを勉強中です。 オブジェクト指向プログラミングを習得しようと努力しております。 あるHTML要素(例ではelm)にクリックイベントを付加する際、オブジェクト内のmyFuncを呼ぶのに以下のようにthis.myFuncとすると、thisがHTML要素となるためにエラーが出ます。 elm.addEventListener("click", this.myFunc, false); これを回避する目的で elm.addEventListener("click", (function(that) { return function() { that.myFunc(); } } )(this), false); とオブジェクト内からクロージャを使って定義することで解決することは分かったのですが、このイベントを削除するのに、 elm.removeEventListener("click", (function(that) { return function() { that.myFunc(); } } )(this), false); や elm.removeEventListener("click", function() { that.myFunc(); }, false); としても除去することが出来ません。この場合はどのようにイベントを削除することが出来るのでしょうか？ そもそもクロージャを使った定義部分に問題があるのでしょうか？ どうぞ教えていただきますようお願いいたします。
- ベストアンサー
- JavaScript