Backbone.js और pushState

Question

यदि मैं रीढ़ की हड्डी राउटर में पुशस्टेट सक्षम करता हूं, तो क्या मुझे सभी लिंक पर वापसी झूठी उपयोग करने की आवश्यकता है या रीढ़ की हड्डी स्वचालित रूप से इसे संभालती है? क्या एचटीएमएल भाग और स्क्रिप्ट भाग दोनों में कोई नमूने हैं।

Answer 1

यह पैटर्न उसके boilerplate में टिम Branyen का उपयोग करता है:

initializeRouter: function() { 
    Backbone.history.start({ pushState: true }); 
    $(document).on('click', 'a:not([data-bypass])', function (evt) { 

    var href = $(this).attr('href'); 
    var protocol = this.protocol + '//'; 

    if (href.slice(protocol.length) !== protocol) { 
     evt.preventDefault(); 
     app.router.navigate(href, true); 
    } 
    }); 
} 

कि का उपयोग करना, बल्कि अलग-अलग लिंक पर preventDefault कर की तुलना में, आप रूटर उन्हें डिफ़ॉल्ट रूप से संभालने के लिए और एक data-bypass विशेषता होने से अपवाद बनाते हैं। मेरे अनुभव में यह एक पैटर्न के रूप में अच्छी तरह से काम करता है। मुझे आसपास के किसी भी महान उदाहरण के बारे में पता नहीं है, लेकिन इसे स्वयं की कोशिश करना बहुत कठिन नहीं होना चाहिए। रीढ़ की सुंदरता अपनी सादगी में निहित है;)

Answer 2

$(document.body).on('click', 'a', function(e){ 
    e.preventDefault(); 
    Backbone.history.navigate(e.currentTarget.pathname, {trigger: true}); 
}); 

Answer 3

match() या startsWith() (ईएस 6) भी प्रोटोकॉल की जाँच के लिए इस्तेमाल किया जा सकता। यदि आप pathname संपत्ति द्वारा पूर्ण यूआरएल का समर्थन करना चाहते हैं, तो location.origin द्वारा आधार यूआरएल देखें।

function(evt) { 
    var target = evt.currentTarget; 
    var href = target.getAttribute('href'); 

    if (!href.match(/^https?:\/\//)) { 
    Backbone.history.navigate(href, true); 
    evt.preventDefault(); 
    } 
    // or 

    var protocol = target.protocol; 

    if (!href.startsWith(protocol)) { 
    // ... 
    } 
    // or 

    // http://stackoverflow.com/a/25495161/531320 
    if (!window.location.origin) { 
    window.location.origin = window.location.protocol 
    + "//" + window.location.hostname 
    + (window.location.port ? ':' + window.location.port: ''); 
    } 

    var absolute_url = target.href; 
    var base_url = location.origin; 
    var pathname = target.pathname; 

    if (absolute_url.startsWith(base_url)) { 
    Backbone.history.navigate(pathname, true); 
    evt.preventDefault(); 
    } 
} 

Answer 4

आप html में <a> टैग पर क्लिक के डिफ़ॉल्ट व्यवहार को रोका जा सकता है। बस नीचे दिए गए कोड को <script /> टैग के अंदर जोड़ें।

<script> 
$(document).on("click", "a", function(e) 
{ 
    e.preventDefault(); 
    var href = $(e.currentTarget).attr('href'); 
    router.navigate(href, true);router 
}); 
</script>