[jQuery] クリックしたリンクURLを取得する方法

jQueryを使ってクリックされたリンクのURLを取得する方法についてです。
サンプルのHTMLとjQueryのソースは以下のようになります。
XHTML
1 2 3 4 5 6 7 |
<div class="pagination"> <ul> <li><a href="http://www.example.com/index?page=1">1</li> <li><a href="http://www.example.com/index?page=2">2</li> <li><a href="http://www.example.com/index?page=3">3</li> </ul> </div> |
jQuery
1 2 3 4 5 6 |
<script type="text/javascript"> $(document).on('click', '.pagination a', function() { val = $(this).attr("href"); alert(val); }); </script> |
今回は divのクラス名 pagination の下の階層にある要素(子孫要素)a のURLを取得したいので、onの第二引数に .pagination a を指定しています。
val = $(this).attr(“href”);
でクリックしたa要素の url を val という変数に代入しています。
この方法はajaxでページャーを作る時に活用できます。関連記事
- [JQuery] Ajaxが使える状態かどうかチェックする方法
- [Ajax] jQueryとPHPでWebページの一部分を更新する方法
- [JavaScript] 現在のURLやパラメタを取得する方法(Location)
- [JQuery] Datepickerで日付をカレンダー形式で簡単に入力する方法
- [jQuery] クリックされたリストの番号やテキストを取得する方法