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

jQueryを使ってクリックされたリンクのURLを取得する方法についてです。

サンプルのHTMLとjQueryのソースは以下のようになります。

XHTML
<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
<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でページャーを作る時に活用できます。



Author: webmaster