イベントの扱い方その0(基本)
さて、イベントですよ、イベント。
これがなくっちゃ最近のGUIアプリなんて作れませんよ。
じゃ、さっそく基本から。
$(セレクター).イベント(function(){ $(セレクター).命令 });
これだけ。
jQueryだとイベントの登録はこれで大丈夫なんだろうか?
確かjavascriptでのイベント登録って、特定のメソッド使わないとなんか不都合が発生するんじゃなかったっけ?
よく覚えてないのでグーグル先生に聞いてみるとこんな記事が。
すげー。こんなに詳しい説明が・・・俺もっと頑張らないと。。
(でも正直互換性の為の知識は蓄えたくねぇ。なぜなら標準が策定されたら必死に蓄えたその知識は不要になるからだ。)
さて。
jQueryってこれらを吸収してくれるって解釈しちゃっていいんだろうか?と思ってjQueryのソースを見てみた。
しかし今の俺では追いきれなかった。。
(javascriptの言語仕様は「推測ができる」レベルで詳細を知ってるわけじゃないからなぁ。)
ま、とりあえず今の目的は「jQueryを使えるようになること」なので、放置してサクサク進めるぜ!
まずはオーソドックスにボタンにイベント登録してみよう!
<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() { $("#button1").click(function(){ $("#div1").text("ぱんぱかぱんつでぱんぱかぱん♪"); }) }) </script> </head> <body> <input type="button" id="button1" value="ぱんぱかぼたん"> <div id="div1">ぱんぱかぱんつ</div> </body> </html>
おお〜、ちゃんとボタンクリックのタイミングでテキストが変わった!!
こうなってくると楽しいよねぇ〜♪