jquery tabs - load url in die aktuelle tab?

Ich versuche, herauszufinden, wie laden Sie die url jeder Registerkarte links in die tab area onclick, und haben versucht folgenden die docs bei http://docs.jquery.com/UI/Tabs#...open_links_in_the_current_tab_instead_of_leaving_the_page, bin aber eindeutig nicht bekommen....

Dies ist das HTML-markup:

<div class="tabs">
  <ul class="tabNav">
    <li><a href="/1.html#tabone">Tab One</a></li>
    <li><a href="/2.html#tabtwo">Tab Two</a></li>
    <li><a href="/3.html#tabthree">Tab Three</a></li>
  </ul>
</div> 

<div id="tabone"> 
     <!-- Trying to load content from 1.html in this div on click --> 
</div>

<div id="tabtwo"> 
     <!-- Trying to load content from 2.html in this div on click --> 
</div>

<div id="tabthree"> 
     <!-- Trying to load content from 3.html in this div on click --> 
</div>

- Und dies ist die jquery ich versuche zu verwenden:

$(".tabs").tabs({
    load: function(event, ui) {
            $('a', ui.panel).click(function() {
                    $(ui.panel).load(this.href);
                    return false;
                });
    }
    });

Ich weiß, ich habe teilweise falsch.... Ich habe durch mehrmaliges (zu viele, um post), und alles was ich bekomme ist ein leeres div-Element... ich weiß nicht... das Gefühl ein wenig verwirrt hier... Hilfe?

InformationsquelleAutor BigDogsBarking | 2010-04-23
  1. 2

    Die Seite, auf den Sie verweisen, ist bestimmt für das laden von links verwiesen wird, auf der Registerkarte in die aktuelle Registerkarte, laden Sie die Register selbst aus einem link. Sie sollten nicht brauchen, um verwenden Sie die load-Methode, um links als tabs zu arbeiten.

    Alles, was Sie wirklich brauchen sollte, ist dieser (kann man auch weglassen tab container DIVS). Ich gehe davon aus, dass die anderen tabs sind relativ und stellen die vollständigen Inhalte der Registerkarte also ich habe entfernt die führenden / und die hash.

    <div class="tabs"> 
  <ul class="tabNav"> 
    <li><a href="1.html" title="Tab One">Tab One</a></li> 
    <li><a href="2.html" title="Tab Two">Tab Two</a></li> 
    <li><a href="3.html" title="Tab Three">Tab Three</a></li> 
  </ul> 
</div>

<script type="text/javascript">
    $(function() {  //note wrap in 'ready" function to make sure DOM is loaded
        $('.tabs).tabs();
    });
</script>
    InformationsquelleAutor tvanfosson
  2. 0

    Bitte stellen Sie sicher, fügen Sie folgenden JS-code auch nach dem laden von tabs.

    $('#tabs ul li.ui-tabs-selected a').click(function(){
                location.href = $(this).attr('href');
                return false;
        }).css('cursor', 'pointer');

    Prost!!!

    InformationsquelleAutor Hitesh Patel
Schreibe einen Kommentar