- ベストアンサー
onclickを使わずにクリック元を特定する方法はないでしょうか
- クリック元を特定する方法であるonclickを使わずに、別の方法を模索しています。
- イベントリスナーを使用して位置を特定することができません。
- 試した方法ではエラーが発生してしまいました。
- みんなの回答 (5)
- 専門家の回答
質問者が選んだベストアンサー
>cds[1].addEventListner('click',fg(this.target),false); 第二引数は関数そのものを渡してください。 cds[1].addEventListner('click',fg,false); fg関数内では、引数がイベントオブジェクトで、 イベントオブジェクト.targetに対象となる要素が入っています。 function fg(e){ var t=e.target; 以下略 }
その他の回答 (4)
- dscripty
- ベストアンサー率51% (166/325)
Chrome だとフォーカスを維持してくれないから a:focus の効果がなくなるけど、Internet Explorer 8 と Firefox 13 はいけた。 <!DOCTYPE HTML> <html lang="ja"> <head> <meta charset="UTF-8"> <title>onclickを使わずにクリック元を特定したい</title> <style> body { font-family:arial, meiryo, sans-serif; } .cn > a { display:block; text-decoration:none; } .cn > a > span { display:block; } .cn > a:focus { background-color:black; } .cn+.cn { padding-top:1em; } </style> </head> <body> <h1>onclickを使わずにクリック元を特定したい</h1> <div id="id"> <div class="cn"> <a href="http://example.org/sample129/" target="_blank"> <span>~</span> <span>~</span> </a> </div> <div class="cn"> <a href="http://example.org/sample128/" target="_blank"> <span>~</span> <span>~</span> </a> </div> <div class="cn"> <a href="http://example.org/sample127/" target="_blank"> <span>~</span> <span>~</span> </a> </div> </div><!-- #id --> </body> </html>
お礼
cssも使えますね。有難うございます。
- 神崎 渉瑠(@taloo)
- ベストアンサー率44% (1016/2280)
すみません、コピーペーストしたので間違えました。訂正です。 via:No.1 × addEventListner ○ addEventListener
お礼
訂正有難うございます。
- fujillin
- ベストアンサー率61% (1594/2576)
要領のみですが・・・ document.getElementById("id").addEventListener("click", function(evt){ var t = evt.target; while(t && t.className != "cn") t = t.parentNode; if(t) t.style.backgroundColor = "#000"; }, false); イベントハンドラの第一引数にイベントオブジェクトが返されるので、それを用いて要素を特定できます。 そこからclass="cn"の要素に遡って、背景色を変える部分のみの例。 実際にはクラス設定が複数あったり(class="abc cn"とか)する可能性があるし、また、IEの場合はイベントのバインド方法が異なったりします。
お礼
有難うございます。
- yambejp
- ベストアンサー率51% (3827/7415)
IEは無視してよいのでしょうか? とりあえずtypo ×addEventListner ○addEventListener
お礼
有難うございます。
お礼
有難うございます。