JQuery में पुनः लोड किए बिना हैश बदलें

Question

मेरे पास निम्न कोड है:

$('ul.questions li a').click(function(event) { 
    $('.tab').hide(); 
    $($(this).attr('href')).fadeIn('slow'); 
    event.preventDefault(); 
    window.location.hash = $(this).attr('href'); 
}); 

यह आपके द्वारा क्लिक किए जाने पर आधारित एक div को फ़ेडेड करता है लेकिन जब आप क्लिक करते हैं तो मैं पेज यूआरएल हैश टैग बदलना चाहता हूं ताकि लोग इसे कॉपी और बुकमार्क कर सकें। फिलहाल हैश टैग बदलते समय यह पृष्ठ को प्रभावी ढंग से पुनः लोड करता है।

क्या हैश टैग को बदलना संभव है और कूदने वाले प्रभाव को रोकने के लिए पृष्ठ को फिर से लोड नहीं करना संभव है?

Answer 1

यह लगभग समान कोड के साथ एक डेमो के लिए मेरे लिए काम करता

$('ul.questions li a').click(function(event) { 
    event.preventDefault(); 
    $('.tab').hide(); 
    window.location.hash = this.hash; 
    $($(this).attr('href')).fadeIn('slow'); 
}); 

यहाँ http://jsbin.com/edicu चेक काम करेगा

Answer 2

आप ऑनलोड ईवेंट को पकड़ने का प्रयास कर सकते हैं। और कुछ ध्वज पर निर्भर प्रचार को रोकना।

var changeHash = false; 

$('ul.questions li a').click(function(event) { 
    var $this = $(this) 
    $('.tab').hide(); //you can improve the speed of this selector. 
    $($this.attr('href')).fadeIn('slow'); 
    StopEvent(event); //notice I've changed this 
    changeHash = true; 
    window.location.hash = $this.attr('href'); 
}); 

$(window).onload(function(event){ 
    if (changeHash){ 
     changeHash = false; 
     StopEvent(event); 
    } 
} 

function StopEvent(event){ 
    event.preventDefault(); 
    event.stopPropagation(); 
    if ($.browser.msie) { 
     event.originalEvent.keyCode = 0; 
     event.originalEvent.cancelBubble = true; 
     event.originalEvent.returnValue = false; 
    } 
} 

नहीं परीक्षण किया है, तो यह नहीं कह सकते, अगर यह

Answer 3

स्वीकार किए जाते हैं जवाब मेरे लिए काम नहीं करता क्योंकि मेरा पेज क्लिक पर थोड़ी देर कूद गया, मेरी स्क्रॉल एनीमेशन को गड़बड़ कर रहा था।

मैंने window.location.hash विधि का उपयोग करने के बजाय window.history.replaceState का उपयोग कर पूरे यूआरएल को अपडेट करने का फैसला किया। इस प्रकार ब्राउज़र द्वारा निकाल दिया गया हैश चेंज घटना को रोकना। ($ ("एक") क्लिक समारोह (घटना) {event.preventDefault(); खिड़की:

// Only fire when URL has anchor 
$('a[href*="#"]:not([href="#"])').on('click', function(event) { 

    // Prevent default anchor handling (which causes the page-jumping) 
    event.preventDefault(); 

    if (location.pathname.replace(/^\//,'') == this.pathname.replace(/^\//,'') && location.hostname == this.hostname) { 
     var target = $(this.hash); 
     target = target.length ? target : $('[name=' + this.hash.slice(1) +']'); 

     if (target.length) {  
      // Smooth scrolling to anchor 
      $('html, body').animate({ 
       scrollTop: target.offset().top 
      }, 1000); 

      // Update URL 
      window.history.replaceState("", document.title, window.location.href.replace(location.hash, "") + this.hash); 
     } 
    } 
});