jQueryUIの下で選択されている検出タブ

Question

jQueryuiタブコンポーネントの新しいタブがクリックされたときを検出しようとしています。私はいくつかのガイドとブログを辿ってきましたが、そのプロセスの周りを頭で覆うことはできません。私は以下を持っています：

$('#tabs').tabs({ 
    select: function(event,ui) { 
    alert('selected'); 
    return false; 
    },     
}); 

私は何が欠けているのかわかりませんが、警告は起きません。私はおそらく愚かな間違いをしているので、私はjQueryで強くないので、どんな助けも高く評価されます。

おかげで、 クリス

更新：jsfiddle例http://jsfiddle.net/T7czp/16/

Answer 1

エラーが表示されますか？ selectの後ろの末尾に,があると、一部のブラウザでスクリプトが壊れます。

これは、このフィドルに見られるように動作します：http://jsfiddle.net/T7czp/15/

$('#tabs').tabs({ 
    select: function(event,ui) { 
    alert('selected: '+ui.index); 
    } 
}); 

Answer 2

あなたがタブにイベントをバインドする必要があります。

$("#tabs").bind("tabsselect", function(e, tab) { 
    alert("The tab at index " + tab.index + " was selected"); 
}); 

Answer 3

@Kristofer

あなたのコードが正しいです。

あなたが選択し得るタブに順番に削除しなければならない唯一の事

はラインです：

return false; 

ためTabs component documentationによると：

なお、もしtabsselectイベントリターンのハンドラfalseの場合、クリックされたタブは選択されません（たとえば、次のタブに切り替えるにはフォームの検証が必要な場合など）。

は（ "tabselect" イベントハンドラを "選択" に該当する）

Answer 4

最新版の使用

$('#tabs').tabs({ 
    activate: function(event,ui) { 
    alert('selected: '+ui.index); 
    } 
}); 

Answer 5

jqueryのUI最後に受け入れ答え以来、わずかに変更されているようです。

TEHアクティベート関数で定義されたUIパラメータは今これに似たオブジェクトである。

オブジェクト{oldTab = {...}、oldPanel = {...}、NEWTAB = {... }、more ...}

インデックスメソッドは、それぞれの内部にあります。更新されたアクセス方法は次のとおりです：

$('#tabs').tabs({ 
    activate: function(event,ui) { 
    alert('selected: '+ui.newTab.index()); 
    } 
});