JQuery リンク設定方法について

質問

JQueryのリンク設定方法についてご教授いただけると幸いです。

■内容
以下のアドレスにあるJQueryですが、リンクをクリックしたときにリンク先へページ移動する設定をご存じの方ご教授いただけると幸いです。
http://www.wizzud.com/jqdock_examples_folder/example.submenus.html

例えばsub-option L1をクリックするとyahooページに移動するという意味です。
単純にhtmlでリンク設定しても駄目でした。

元ページ
http://www.wizzud.com/jqdock/examples/

宜しくお願い致します。

回答No.2

LancerVII · ベストアンサー

こんにちは。

HTMLは以下のように通常にhrefにURLを設定します。
<li><a href='http://yahoo.co.jp'><span>sub-option L1</span></a>

JavaScriptのほうで手を加える必要があります。
http://www.wizzud.com/jqdock_examples_folder/example.submenus.html
のソース内63行目付近
.find('a').click(function(){
$(this).toggleClass('clicked');
this.blur();
return false;
})
なっているものを以下のようにします。

.find('a').click(function(){
var url = $(this).attr('href');
if ( url !== '#' ) {
return true;
}
$(this).toggleClass('clicked');
this.blur();
return false;
})
動作原理は、クリックされたaタグのhref属性を取得してurl !== '#'(#以外の場合)はtrueを返すようにします。
上記ロジックを加えないと常にfalseが返るためリンクとしての機能が動きません。

お礼

ご教授ありがとうございます。
希望通りに動作いたしました。
LancerVIIさんの解りやすい解説と知識に感服いたしました。
大変に感謝致します。

回答No.1

mogeraccho

ちらっとソースを拝見して、まともに実行してない状態での回答で申し訳ないのですが、

>単純にhtmlでリンク設定しても駄目でした。
これの意味が理解できません。
例えば98行目の
<a href='#'><span>sub-option L1</span></a>
を
<a href='http://～～～'><span>sub-option L1</span></a>
としてダメだった、という意味でしょうか？

補足

説明不足ですみません。
上記の様に記載しても駄目でした。
右クリックからリンクを新しいタブで開くでは可能ですが、たんじゅに左クリックでは選択まででリンク先へ進めませんでした。