dポイントプレゼントキャンペーン実施中!

お世話になります。あともう少しのところでうまくいきません!
http://papermashup.com/demos/jquery-tabs/
上記を使ってタブをやっています
【html】
<div id="test">
<ul>
<li class="menu01"><a href="#tab-1">タブ1</a></li>
<li class="menu02"><a href="#tab-2">タブ2</a></li>
<li class="menu03"><a href="#tab-3">タブ3</a></li>
<li class="menu04"><a href="/test/">こいつだけ違うページへ</a></li>
</ul>
<div id="tab-1">タブ1の中身</div>
<div id="tab-2">タブ2の中身</div>
<div id="tab-3">タブ3の中身</div>
</div>
【Jquery】
<script type="text/javascript">
$(document).ready(function(){
$('#topserch div').hide();
$('#topserch div:first').show();
$('#topserch ul li:first').addClass('active');
$('#topserch ul li a').click(function(){
$('#topserch ul li').removeClass('active');
$(this).parent().addClass('active');
var currentTab = $(this).attr('href');
$('#topserch div').hide();
$(currentTab).show();
return false;
});
});
</script>

まずこのままだ4つ目のリンクはまったく動きません。
そこで、return false;を取ると、当然変な動きになります。
<li class="menu04"><a href="/test/">こいつだけ違うページへ</a></li>
をクリックした時だけ、普通に別のページにジャンプさせるにはどうしたらよいのでしょうか?

A 回答 (2件)

jqueryはよく知りませんが…



リンク要素に全て同じタブの処理を設定しているのでご質問のようになっているので、(ご提示のソースから識別するなら)classがmenu04の場合だけ何もしないようにすれば良いのでは?
(とはいっても、menu04だけ何もしないという構成も変な気がしますが…)

具体的には、タブ処理の最初で
 if ($(this).parent().hasClass('menu04')) return;
とでもしておくとか。

あるいは、イベントの設定自体をはずしてしまうのなら
 $('#topserch ul li a').filter( function() {
  return !$(this).parent().hasClass('menu04');
 }).click(function() {  ~~~
みたいにするのでもよいかも。
    • good
    • 0
この回答へのお礼

ありがとうございます!
if ($(this).parent().hasClass('menu04')) return;
おっしゃるとおり、これをタブ処理の最初に書いたらできました!

ばっちりmenu4の時だけタブ処理せずに別のページにいきました。

parent().hasClass('menu04')
とっても参考になりました、ありがとうございます!

お礼日時:2010/01/07 13:41

jqueryはつかっていませんが・・・



hrefの値に.match(/^#/)で条件をきりわけてやればいいのでは?

この回答への補足

回答ありがとうございます。

例えば、Javascriptで
location.href='/test/'

なんかでも別のページに飛ばすことはできますが、別のページが読み込まれる前に、一度
<div id="tab-1">タブ1の中身</div>
<div id="tab-2">タブ2の中身</div>
<div id="tab-3">タブ3の中身</div>
のdivが当然消えるので、すごく変な動きになってしまうんです。
(divが消えてから別のページが読まれて)

だから、
<li class="menu04">をクリックしたときににも
return false;
してあげなければいけないのかな~と思ってはいるのですが、どうしたらいいのか分からないんです・・・

補足日時:2010/01/07 12:54
    • good
    • 0

お探しのQ&Aが見つからない時は、教えて!gooで質問しましょう!