0

jQuery UI タブを使用して、複数ページの Web サイトを SPA に書き直そうとしています。シェル ページでは、1 つのタブがページ内の ID を参照し、残りのタブは AJAX を介して他のページをロードします。次のようになります。

<div id="tabs">
    <ul id="nav">
        <li><a href="#home">HOME</a></li>
        <li><a href="ajax/learn.html">LEARN</a></li>
        <li><a href="ajax/listen.html">LISTEN</a></li>
        <li><a href="ajax/support.html">SUPPORT</a></li>
        <!--etc.-->
    </ul>
    <div id="home">
        <!--blah blah blah-->
    </div>
</div>

内learn.htmlには、同じように設定された別の UI タブのセットがあります。

<div id="tabs2">
    <ul id="nav2">
        <li><a href="#about">About Us</a></li>
        <li><a href="ajax/sponsors.html">Sponsors & Donors</a></li>
        <li><a href="ajax/staff.html">Staff & Board</a></li>
        <!--etc.-->
    </ul>
    <div id="about">
        <!--blah blah blah-->
    </div>
</div>

内のタブをクリックすると問題が発生しますlearn.html。この AJAX タブ内の AJAX タブの 1 つをクリックすると、ウィンドウやsponsors.html、シェル ページの代わりに読み込まれるものが表示されます。

試してみevent.stopPropagation()ましたが、うまくいきませんでした; タブで使用event.preventDefaultすると、そもそもタブの機能が妨げられました。他に何をする必要がありますか？

4

3 に答える 3

0

ajax 呼び出しの結果を特定の div に追加してみてください。ajax 呼び出しの成功関数。

于 2013-06-25T16:00:27.080 に答える
0

タブまたはアンカーのクリックで preventDefault を呼び出していますか? アンカー クリック用に別のハンドラーを設定する必要がある場合があります。

$("ul#nav2 li a").click(function(e) {
    e.preventDefault();
});
于 2013-06-25T16:09:17.977 に答える