2009年7月17日金曜日

jQueryでクリックされたエレメントの属性を取得する

どうも、俺@仕事中です。

jQuery+Ajaxを使ってインタラクティブなデザインのシステムを構築中なのですが、ちょっとハマったのでめも。

画面にテーブルとか使って、何かデータを一覧表示した場合に、クリックされた要素のvalue値やname属性の値やidの値とか取りたくて、取りたくて、、、取れなくて1時間悩みました。。。

例えば
<td><a href="foo" id="foo_id" value="foo_value">FOO</a></td>
<td><a href="bar" id="bar_id" value="bar_value">BAR</a></td>
のようなテーブルがあるとします。

これでjQueryで'FOO'をクリックした時に、その<a>タグに指定してあるid値やvalue値を取得したい!場合は
$("a").click(function() {
 id = $(this).attr("id"); // idの取得
 val = $(this).attr("value"); // valueの取得
});
という調べたらすぐ分かるような方法で取得できます。

調べ方ってとっても重要ですね!!
以上~~~~。

1 件のコメント:

匿名 さんのコメント...

今ちょうど探しておりますプログラムでこれはシンプルで良いなと思ったのですが
1点分からない点があり困っております。

Aタグをクリック⇒AタグのIDを取得⇒AタグのIDを表示(※ここがわかりません)

できればbodyタグより下でdivタグなどで数値として表示させたいです。

ずいぶん古いものなのでこのブログの作成者も拝見しておられないかもしれませんが
もしコメントを拝見したのであればご教示よろしくお願いします。