jQuery यूआई टैब - टैब का संयोजन और यूआरएल

Question

पर जाने के लिए चयन करें मैं अपने जावास्क्रिप्ट और एचटीएमएल को कैसे संशोधित करूं ताकि पहला टैब सामान्य के रूप में काम करता है और दूसरा टैब मेरी विंडो को पूरी तरह से नए पृष्ठ पर निर्देशित करता है?

मुझे यह मिला: http://snipplr.com/view/9513/, लेकिन यह समझ नहीं सका कि इसे कैसे कार्यान्वित किया जाए।

मेरे स्क्रिप्ट:

<script type="text/javascript"> 
$(document).ready(function(){ 

$('#tabs').tabs();  

    if($("#tabs") && document.location.hash){ 
     $.scrollTo("#tabs"); 
    } 
    $("#tabs ul").localScroll({ 
     target:"#tabs", 
     duration:0, 
      hash:true 
    }); 

    $('#tabs-min').tabs(); 

}); 

मेरे एचटीएमएल

<div id="tabs"><ul> 
    <li><a href="#tab1">Tab 1</a></li> 
    <li><a href="URL HERE" class="leave">Tab 2</a></li></ul> 

    <div id="tab1">tab1 content</div> 
</div> 

Answer 1

मैं एक बेला ऊपर और here मिल जाता है। यह पूरी तरह से काम नहीं करता है और मैं इसका अनुमान लगा रहा हूं क्योंकि एक पहेली चलाने से आपको पहेली को छोड़ने नहीं दिया जाएगा (इसलिए window.location वास्तव में काम नहीं कर रहा है), लेकिन आप देख सकते हैं कि यह कैसे किया जाता है। मैंने इस कोड का परीक्षण अपने पर्यावरण में किया है और यह काम करता है।

आप अनिवार्य रूप से उस लिंक को एक श्रेणी जोड़ते हैं जिसके साथ आप जाना चाहते हैं (मेरे मामले में, मैंने कक्षा leave जोड़ा है)। फिर, पहले एक्टिवेट पर, आप जांचते हैं कि नए टैब के लिंक में कक्षा leave है और यदि ऐसा होता है, तो इसके लिंक स्थान पर जाएं।

मुझे बताएं कि यह आपके लिए काम करता है या नहीं।

<script> 
$(function() { 
    $("#tabs").tabs({ 

      beforeActivate: function(event, ui) { 

       if (ui.newTab.find("a").hasClass("leave")) { 

        alert("leaving..."); 
        window.location = ui.newTab.find("a").attr("href"); 
        return false; 
       }    
     } 
    }); 
}); 
</script> 
<div id="tabs"> 
    <ul> 
     <li><a href="#tabs-1">Nunc tincidunt</a></li> 
     <li><a href="http://www.google.com" class="leave">Proin dolor</a></li> 
     <li><a href="#tabs-3">Aenean lacinia</a></li> 
    </ul> 
    <div id="tabs-1"> 
     ... 
    </div> 
    <div id="tabs-2"> 
     ... 
    </div> 
    <div id="tabs-3"> 
     .... 
    </div> 
</div>