1

jQuery タブを使い始めたばかりです。これを Web.API サイトでホストしています。次のように（かみそりでレンダリングされた）ページにタブを作成しました。

<div id="tabs">
    <ul>
        <li><a href="WebApiAppOne">ApplicationOne</a></li>
        <li><a href="WebApiAppTwo">ApplicationTwo</a></li>
    </ul>
</div>

そして、私は次のjQueryを持っています:

$( document ).ready( function () {
    $( "#tabs" ).tabs( {
        load: function ( event, ui ) {
            $( ui.panel ).delegate( 'a', 'click', function ( event ) {
                $( ui.panel ).load( this.href );
                event.preventDefault();
            } );
        },
        beforeLoad: function ( event, ui ) {
            ui.jqXHR.error( function () {
                ui.panel.html( "Unable to load tab content" );
            } );
        }
    } );
} );

最初のタブにはWebApiAppOneコンテンツが表示されますが、次のタブをクリックすると に直接移動しhttp://localhost/WebApiAppTwoます。タブ 2 のコンテンツ領域内ではありません。タブはなくなりました。

ここでの私の目標は、このサイトにあるいくつかの Web アプリを共通のランディング ページに統合し、タブを使用して、ユーザーがどのアプリに移動するかを選択できるようにすることでした。しかし、私はこれを適切に機能させることができないようです。

私が間違っていることについて何か考えはありますか？

4

2 に答える 2

0

私は問題を発見しました - web.api サイトはデフォルトで modernizer-2.5.3.js を呼び出します - どういうわけかこれは jQuery のタブ機能を壊していました。

理由はわかりませんが、コールアウトをコメントするとすべてが修正されました。

于 2013-04-12T20:34:52.637 に答える