Need the HTML content of the current JQUERY-UI Tab

Question

<div id="tabs">
      <ul> 
        <li><a href="1.asp" title="Tab One">Tab One</a></li> 
        <li><a href="2.aso" title="Tab Two">Tab Two</a></li> 
        <li><a href="3.asp" title="Tab Three">Tab Three</a></li> 
      </ul> 
    </div>

I have a tab widget, displaying content from different urls.

I need an expression, to get the contents (HTML string) of the currently displayed content, in the tab panel. Something like

alert($('tabs').tabs('option', 'selectedpanel').innerHTML);

The only reference I have is the JQuery documentation http://api.jqueryui.com/tabs/ , but I could not get an suitable answer from the API documentation there.

Answer 1

Just use the load event of the tabs as below :

<script>
$(function() {
    $( "#tabs" ).tabs({
        load: function( event, ui ) {
            alert(ui.panel.html());
        }
    });
});
</script>