[AJAX]zakładki tab bez przeładowywania i ich zapamiętanie po odświeżeniu, jak to wykonać. Opcje

[casperii]

Witam,
Chciałbym to zmodyfikować w ten sposób aby, po wybraniu taba i odświeżeniu strony pamiętało który tab był wczytany. Zrobiłem póki co tak:
mam kod:

[HTML] pobierz, plaintext 
<script>
$(function (){
	$('[data-tab]').on('click', function (e){
		var that = $(this);
		var parent = that.parent().parent().parent();
		that
		.addClass('active')
		.siblings('[data-tab]')
		.removeClass('active');
		$('[data-content]',parent)
		.removeClass('active')
		.siblings('[data-content=' + that.data('tab') + ']')
		.addClass('active');
		e.preventDefault();	
	});
});
</script>
<div style="margin-bottom:10px;" data-tab="#1" class="tab active">link1</div>
<div style="margin-bottom:10px;" data-tab="#2" class="tab">link2</div>
 
<div data-content="#1" class="klasa active">zawartość</div>
<div data-content="#1" class="klasa">zawartość drugiego taba</div>
[HTML] pobierz, plaintext 

Rozumiem, że teraz powinienem zrobić coś na styl :

select: function(event, ui) {
window.location.replace(ui.tab.hash);
}

Ale za cholerę nie mogę sobie z tym poradzić.

Ten post edytował casperii 21.05.2015, 19:58:15

[Comandeer]

Eh, ja o A, a Ty o B… (IMG:style_emoticons/default/wink.gif)
elem.click() vs elem.on('click', function() {[…]}) - widać różnicę?

Kod

if(location.hash)
        $('[data-tab=' + location.hash + ']').click();

Łap cały kod JS:

Kod

$(function (){
    $('[data-tab]').on('click', function (e){
        var that = $(this);
        var parent = that.parent().parent().parent();
        var url = location.pathname + that.data('tab');
        var hash = url.substring(url.indexOf('#'));
        window.location.replace(url);
        that
        .addClass('active')
        .siblings('[data-tab]')
        .removeClass('active');
        $('[data-content]',parent)
        .removeClass('active')
        .siblings('[data-content=' + that.data('tab') + ']')
        .addClass('active');
        e.preventDefault();
        //alert('zobacz' + url);
    });

    if(location.hash)
        $('[data-tab=' + location.hash + ']').click();
});