2009-05-31 8 views
5

jqueryuiタブセットがあるページがあります。私は選択された最初のタブ以外のタブでページを開くことができるようにしたいと思います。ページに4つのタブがある場合、4つのタブのいずれかを「開く」タブにする必要があります。最初のタブではないタブがあらかじめ選択されています。

これは別のページからのリンクか、同じフレームセット内のページからのリンクかもしれません。

すべてのカバーの下にはすべてPHPです。

答えて

3

JavaScriptを使用してページの最初の読み込み時にタブを選択すると便利です。ここでは、タブを選択する方法の例です:

インデックス変数は、あなたが選択しているしたいタブの整数である

http://docs.jquery.com/UI/API/1.7/Tabs#method-select

<script type="text/javascript"> 
    $(function() { 
    $("#tabs").tabs('select' , index) 
    }); 
</script> 

。これは0ベースなので、3番目のタブを選択したい場合は、indexに2を指定します。ページが作成されると

あなたはこれをしたいでしょう:

http://www.learningjquery.com/2006/09/introducing-document-ready

+0

恐ろしいです。答えをいただき、ありがとうございました。 – Jason

+0

タブが既に初期化されているときに、目的のタブを選択する方法です。タブ作成ステップで特定のタブを選択したい場合は、Simen Echholtの2番目の答えを使用する必要があります – dzona

1

タブを初期化するときselectedオプションで行うことができますタブを選択します。

$("#tabs").tabs({ 
    selected: index //index of the tab to be preselected 
}); 

重要な場合は、インデックス0のタブにajaxが読み込まれている場合です。通常どおりタブを初期化してからselectメソッドを使用して選択したタブを変更すると、最初はajaxリクエストがロードされてタブ0になりますが、すぐに別のタブを表示したいのでこのリクエストは不要です。 selectedオプションを使用すると、この要求をスキップできます。

2

上記の回答は、現在のバージョンのjQuery UI v1.10.0では有効ではなくなりました。 jQuery UI APIによると、このオプションは現在アクティブであり、は選択されていませんです。

はここAPIへのリンクです:http://api.jqueryui.com/tabs/#option-active

は、指定したアクティブなオプションを使用してタブを初期化します。

$(".selector").tabs({ active: 1 }); 
1

だけ意図<li>要素にui-tabs-selectedクラスを追加します。jQueryのパス

  1. に従うことによって活性化させるためにどのタブを選択します

    が設定されていない、location.hashは何のハッシュが一致しない場合、任意のタブのhash<a>タグ

  2. のと一致していない場合selectedオプションは
  3. に設定されています任意<li>要素はui-tabs-selectedクラス
  4. (最初に選択しようとしない場合は無効)(ui-state-disabled)タブ

古い質問のビット。このページはgoogleの最初のページです。

+0

現在のjQuery UIでは、クラスは 'ui-tabs-active'になり、' ui-tabs-selected'にはなりません。 – Parham

関連する問題