0

このトピックには多くの質問がありますが、彼らは私が探しているものとは反対のことを望んでいるようです!

追加と削除を使用してjQueryタブを実装しました（これに似ています：http://jqueryui.com/tabs/#manipulation）が、各ページのコンテンツはAjaxを介してプルされます（これに似ています：http://jqueryui.com ） /tabs/#ajax )。

これは正常に機能していますが、コンテンツがリロードされたり、本質的に毎回リセットされたりすることなく、開いているタブを切り替えたいと思います。この理由は、各タブのコンテンツにテキストの強調表示機能 (さまざまなチェックボックスがさまざまな単語を強調表示する) が含まれており、タブの選択を解除したときに選択したチェックボックスを維持したいからです。

毎回リロードせずにタブを交換する方法はありますか?

//Tab variables
var tabTitle = $( "#tab_title" ),
tabContent = $( "#tab_content" ),
tabTemplate = "<li><a href='#{href}'>#{label}</a> <span class='ui-icon ui-icon-close' role='presentation'>Remove Tab</span></li>",
documentTabCounter = 0,
entityTabCounter = 0,
tabs = $( "#tabs" ).tabs();

//On document load, generate the tabs
$(document).ready(function() {
tabs.tabs();
});         

function addDocumentTab(document_id, document_name) {
var nameToCheck = document_name;
var numberOfTabs = 0;
var targetTab = 0;
var tabNameExists = false;

//Loop through the open tabs to check whether the tab is already open (by comparing names) 
$('#tabs ul li a').each(function(i) {
    numberOfTabs++;
    if (this.text == nameToCheck) {     
        tabNameExists = true;
        targetTab = numberOfTabs;   
    }
}); 
//If the tab is not already open, then open a new tab
if (!tabNameExists){
    var label = tabTitle.val() || document_name,
    id = "tabs-" + documentTabCounter,
    li = $( tabTemplate.replace( /#\{href\}/g, js_base_url+'document/'+document_id).replace( /#\{label\}/g, label ) );
    tabs.find( ".ui-tabs-nav" ).append( li );
    tabs.tabs( "refresh" );
    tabs.tabs( "option", "active", documentTabCounter);
    documentTabCounter++;
}
//If the tab is already open, then make it active
else {
    tabs.tabs( "option", "active", targetTab-1);
}       
};`
4

2 に答える 2

0

AJAX から取得した情報を変数または非表示の html 要素に格納し、そこに情報が格納されていない場合にのみ AJAX 呼び出しを行うことができます。

于 2013-07-22T20:52:23.197 に答える