एक jQuery टैब चुनने पर यूआरएल हैश को सही तरीके से कैसे अपडेट करें?

Question

HTML:

<div id="tabs"> 
    <ul> 
     <li><a href="#settings">Settings</a></li> 
     <li><a href="#fields">Fields</a></li> 
    </ul> 
    <div id="settings"> 
     //Tab Contents 
    </div> 
    <div id="fields"> 
     //Tab Contents 
    </div> 
</div> 

मैं कैसे jQueryUI के टैब कार्यक्षमता लागू करते हैं और एक नया टैब का चयन पर यूआरएल हैश अद्यतन करने के लिए यह मजबूर कर सकते हैं?

Answer 1

टैब परिवर्तन पर हैश को अद्यतन करने के अलावा (पहले एक्टिवेट ईवेंट के साथ श्रागर्नॉट के जवाब में) हैश परिवर्तन पर सक्रिय टैब को अपडेट करना बहुत उपयोगी है (यानी ब्राउज़र इतिहास, बैक/फॉरवर्ड बटन सक्षम करना और मैन्युअल रूप से हैश में उपयोगकर्ता टाइपिंग):

$(window).on('hashchange', function() { 
    if (!location.hash) { 
    $('#tabs').tabs('option', 'active', 0); // activate first tab by default 
    return; 
    } 
    $('#tabs > ul > li > a').each(function (index, a) { 
    if ($(a).attr('href') == location.hash) { 
     $('#tabs').tabs('option', 'active', index); 
    } 
    }); 
}); 

Answer 2

इस कोड का प्रयोग करें अपने jQuery यूआई टैब बनाने के लिए:

$('#tabs').tabs({ 
    beforeActivate: function (event, ui) { 
     window.location.hash = ui.newPanel.selector; 
    } 
}); 

मैं इस सवाल का जवाब बनाया है क्योंकि मैं एक अप-टू-डेट विधि के साथ एक भी एक नहीं मिल रहा। उम्मीद है कि यह किसी और की मदद करता है!