イベントの扱い方その1(注意点)
buttonみたいなタグは既に登録されているイベントつーもんはない。
んが、aタグのように、hrefが設定されると自動的にclickイベントが登録されるような要素の場合、自前でclickイベントを登録するとどのように振る舞うかをメモ。
自前イベント処理の最後に「return false;」を追加することで、既存登録されたイベントが実行されないようになるみたい。
<html> <head> <script type="text/javascript" src="http://www.google.com/jsapi"></script> <script type="text/javascript">google.load("jquery", "1.3.2");</script> <script type="text/javascript"> $(function() { //aタグには、href先に飛ぶclickイベントが既に登録されている。 //登録済みのclickイベントが発生しないようにするためには、 //本イベント処理の返り値をfalseにしてやる必要がある。 $("#a1").click(function(){ $("#div1").text("すてきなぱんつでぱんぱかぱんつ♪"); return false; }) //falseを返さない場合はリンク先に飛んでしまう。 $("#a2").click(function(){ $("#div1").text("すてきなぱんつでぱんぱかぱんつ♪"); }) }) </script> </head> <body> <a id="a1" href="http://www3.digisbs.com/anime/vol07.html">ぱんぱかぱんつ</a> <div id="div1">ぱんぱかぱんつ</div> <a id="a2" href="http://www3.digisbs.com/anime/vol07.html">ぱんぱかぱんつ</a> <div id="div2">ぱんぱかぱんつ</div> </body> </html>
そうだなぁ〜。今後は動的に画面を描画するケースが多くなると思うんだけど、そういうときにこちがら意図していないイベントが既に登録されているタグを使用するのはあんまり良い手段じゃないような気がする。
別にdivタグでもspanタグでも使えばいいような。。あるいはこれらをカスタムしたリンク専用のタグとか。
jQuery UI ライブラリに無いのかな?それともうま〜く共存できる方法があるのか・・・?