リンクにクリックイベントを設定するとき
最初
<a href="#" onClick="jump(1);">ページ1</a>
<a href="#" onClick="jump(2);">ページ2</a>
function jump(page) {
location.href = 'http://hoge' + page;
}
としてましたが、なんとなくjQueryでロード時にイベントを設定する方が良いのかなと思って、以下のように直しました
$(function(){
$("#one").click(function(){
location.href = 'http://hoge' + 1;
});
$("#two").click(function(){
location.href = 'http://hoge' + 2;
});
});
<a href="#" onClick="jump();" id="one">ページ1</a>
<a href="#" onClick="jump();" id="two">ページ2</a>
としたのですが、なんか冗長な気がします。どのように書くのがスマートでしょうか。
aリンクのhref属性が「#」になってしまっているのも微妙な気がします。
モダンなのかどうか分かりませんが、自分ならこう書きます。
$(function(){ $(".jump").on('click',function(event){ event.preventDefault(); event.stopPropagation(); location.href = 'http://hoge' + $(this).attr('href'); return false; }); });
<a href="1" class="jump">ページ1</a> <a href="2" class="jump">ページ2</a>
その動作で質問文通りだと思うのですが、
を以下の通りに修正すると、
想定されている動作になりますか?
2013/11/20 16:14:29申し訳ありません。
2013/11/20 16:31:19肝心の$(function(){}を記述し忘れイベント自体がうまく設定できていませんでした。
うまく動きました。ありがとうございます。