jQuery-UI tabs - load just once

Question

I'd like the load content of my tabs thru AJAX, but only on the first tab click. Now the tabs gets loaded every time I click on any tab. Is this possible ?

My html

<div id="tabContainer">
<ul>
<li><a href="/Home/Tab1">Tab1</a></li>
<li><a href="/Home/Tab2">Tab2</a></li>
<li><a href="/Home/Tab3">Tab3</a></li>
</ul>
</div>

EDIT

I cannot use the Cache option,because the content in the tabs may change..

Answer 1

$(function () {
        $("#tabs").tabs({
            beforeLoad: function (event, ui) {
                if (ui.tab.data("loaded")) {
                    event.preventDefault();
                    return;
                }
                ui.ajaxSettings.cache = false;
                ui.panel.html('<img src="images/prettyPhoto/dark_square/loader.gif" width="24" height="24" style="vertical-align:middle;"> Loading...');
                ui.jqXHR.done(function() {
                    ui.tab.data( "loaded", true );
                });
                ui.jqXHR.fail(function () {
                    ui.panel.html(
                    "Couldn't load Data. Plz Reload Page or Try Again Later.");
                });
            }
        });
    });