jQueryツール：1つのAJAXタブ

Question

jQuery Tools Tabsを使用しています。通常のインラインコンテンツタブと1つのAJAXタブがあります。しかし、私は、インライン・コンテンツまたはORAjaxコンテンツのサンプルしか見ることができません。それらを混ぜてもいいですか？

Answer 1

AFAIK、すべてAJAXまたはなしです。しかし、あなたは簡単にAJAXを1枚ペイントすることができます。あなたが行う必要があるのは、クリックハンドラ（好ましくは.one()を使用して、最初に実行された後に自身を削除する）をタブに追加することです。このクリックハンドラはペインのコンテンツを.load()またはその他のAJAXが意味するものでロードできます。

例えば、HTMLは、このようなものになるだろう：

<ul class="tabs"> 
    <li><a href="#">Tab 1</a></li> 
    <li><a href="#">Tab 2</a></li> 
    <li id="ajax-tab"><a href="#">Tab 3</a></li> 
</ul> 
<div class="panes"> 
    <div>First tab content. Tab contents are called "panes"</div> 
    <div>Second tab content</div> 
    <div id="ajax-pane"></div> 
</div> 

とJavaScriptは、このようなものになるだろう：

$("ul.tabs").tabs("div.panes > div"); 
$('#ajax-tab').one('click', function() { 
    $('#ajax-pane').load('/some/path/that/returns/our/html'); 
}); 

そして、ここでは簡単なライブの例です：http://jsfiddle.net/ambiguous/stxha/