- ベストアンサー
HTMLページ内のタグに対してのイベント
- HTMLページ内のタグに対してのイベントを実装する方法を知りたい。
- getElementsByTagNameで指定したタグの要素をクリックした時に関数を呼び出す方法を教えてください。
- タグ別にイベントを判定する方法を知りたい。
- みんなの回答 (3)
- 専門家の回答
質問者が選んだベストアンサー
単純に直すと以下の通り? window.onload = function(){ var imgs = document.getElementsByTagName("img"); for(var i=0;i<imgs.length;i+=1){ imgs[i].onclick = function(){ alert("これは画像です。"); } } }
その他の回答 (2)
- fujillin
- ベストアンサー率61% (1594/2576)
>ひとつひとつにIDを割り当てるというやり方でなくて、~~ element.onclick = ~~の方法だと、一つ一つにイベントを割り当てていく方法になります。 (例示の場合、getElementsByTagNameは配列になるので、直接onclickではうまくいかない) どうせならまとめてひとつのイベントをドキュメントに設定しておけば、代用できると思いますよ。 No1様の方法と同じだけれど、簡略化バージョン。 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"> <html lang="ja"> <head><title>test</title> <meta http-equiv="Content-Script-Type" content="text/javascript"> </head> <body> <div> <img src="a"> <img src="b"> </div> <div> <img src="c"> <img src="d"> </div> <script type="text/javascript"> <!-- document./*@cc_on @if(1) attachEvent('on' + @else @*/ addEventListener(/*@end @*/'click', function (evt) { var t = evt.target || evt.srcElement; alert(t.nodeName + " / " + (t.src || "")); }, false); //--> </script> </body> </html>
お礼
回答ありがとうございます。 こちらは画像のパスも表示されるのですね。 No.1様のところでも書きましたが、もう少し勉強してから 応用させて頂きたいと思います。 ありがとうございました。
- babu_baboo
- ベストアンサー率51% (268/525)
こもじで onclick 。 //@cc_on var Handler = function (evt) { var node = evt./*@if (1) srcElement @else@*/ target /*@end@*/; var doc = node.ownerDocument; var win = doc./*@if (1) parentWindow @else@*/ defaultView /*@end@*/; alert(node.nodeName); alert(node.tagName); alert(node.id); } document./*@if(1)attachEvent('on'+@else@*/addEventListener(/*@end@*/ 'click',Handler, false);
お礼
回答ありがとうございます。 onclick ですね。気をつけます。 勉強不足でこの書き方をまだ十分に理解できていないのですが、 これはすべてのタグに対してイベントを割り当てているのですね。 もう少し勉強して今作っているものに応用したいと思います。 ありがとうございました。
お礼
回答ありがとうございます まさにこういう書き方を知りたかったんです。 No.3様にご指摘いただいていましたが、 getElementsByTagNameで得られるのは配列だということを 分かっていませんでした。 今回のプログラムはこの書き方でいきたいと思います。 ありがとうございました。