jquery tabs - load url in current tab?
        Posted  
        
            by BigDogsBarking
        on Stack Overflow
        
        See other posts from Stack Overflow
        
            or by BigDogsBarking
        
        
        
        Published on 2010-04-23T15:29:13Z
        Indexed on 
            2010/04/23
            15:43 UTC
        
        
        Read the original article
        Hit count: 229
        
I'm trying to figure out how to load the url each tab links to inside the tab area onclick, and have been trying to following the docs at http://docs.jquery.com/UI/Tabs#...open_links_in_the_current_tab_instead_of_leaving_the_page, but am clearly not getting it....
This is the 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>
And this is the jquery I'm trying to use:
$(".tabs").tabs({
    load: function(event, ui) {
            $('a', ui.panel).click(function() {
                    $(ui.panel).load(this.href);
                    return false;
                });
    }
    }); 
I know I've got some part of this wrong.... I've gone through several iterations (too many to post), and all I get is a blank div... I don't know... Feeling a bit confused here... Help?
© Stack Overflow or respective owner