0

私は次の機能を持っています：

function createTabs( selectorText, selected ) {
    var tabs = $( selectorText ).tabs();        
    if( selectorText == '#content .tabs' ) {
        contentTabs = tabs;
        $( selectorText ).unbind( 'tabsselect' ).bind( 'tabsselect', function( event, ui ) {            
            var queryNumber = $( ui.tab ).data('query_number');
            if( queryNumber ) {
                $( ui.panel ).html( '<table id="table"></table>' )
                var table = $( ui.panel ).find( 'table' );
                populateFlexigrid( table, queryNumber );
            }
        });
    }

    if( !selected ) {
        selected = 0;
        tabs.tabs( 'select', 0 )
    }
    tabs.tabs( 'select', selected );
}

関数の最後のifステートメントで、選択したタブを選択する必要のあるタブに設定しています。このifステートメントを入力すると、タブは作成されたばかりなので、選択されるタブは常に 0 です。だから私の問題は、すでに選択されているタブを選択しようとしていることです。これは、そのタブにバインドした機能が実行されていないことを意味します。

タブを強制的に選択したり、tabsselectそのタブのイベントを強制的に実行したりして、バインドされた関数を実行する方法はありますか?

4

2 に答える 2

2

私はこの解決策が好きではありませんが、それは機能しています。誰かがより良い方法を持っているなら、それを投稿してください。

var selectedTab = $tabs.tabs('option', 'selected');
$tabs.find('li').eq(selectedTab).removeClass('ui-tabs-selected').end().tabs('select', selectedTab);
于 2012-04-26T19:22:41.770 に答える
0

tabs.trigger('tabsselect');タブを選択してから追加してみてください。

アップデート：

遅れて申し訳ありませんが、ようやくこれに取り組む時間が見つかりました。

「tabsselect」関数を名前付き関数 (匿名ではない) として書き直してみてください。これにより、(uiイベントが提供するパラメーターを作成した後) いつでも呼び出すことができます。以下のコード例（および動作中のフィドル）：

function tabSelected(event, ui) {
    var queryNumber = $(ui.tab).data('query_number');
    var table = $(ui.panel).find('table');
    console.log('Tab ' + ui.index + ' "tabsselect" event triggered.');
    if (queryNumber) {
        $(ui.panel).html('<table id="table"></table>');
        populateFlexigrid(table, queryNumber);
    }
}

function createTabs(selectorText, selected) {
    var tabs = $(selectorText).tabs();
    var tab = null;
    var panel = null;
    var ui = {
        "index": 0,
        "panel": tab,
        "tab": panel
    };

    if (selectorText == '#content .tabs') {
        contentTabs = tabs;
        $(selectorText).unbind('tabsselect').bind('tabsselect', tabSelected);
    }

    if (!selected) {
        selected = 0;
        tabs.tabs('select', 0);
    }

    //create the ui parameter
    ui.index = selected;
    ui.tab = $(tabs.children('ul:first').children('li')[selected]).children('a')[0];
    ui.panel = tabs.children('div')[selected];

    //run the "tabsselect" function
    tabSelected(null, ui);
}
createTabs('#content .tabs', 0);​
于 2012-04-26T19:02:28.363 に答える