Backbone.js e pushState

Question

Se abilito pushState nel router backbone, devo usare return false su tutti i link o il backbone lo gestisce automaticamente? C'è qualche campione là fuori, sia la parte html che la parte script.

Answer 1

Questo è il modello Tim Branyen usa nel suo boilerplate:

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); 
    } 
    }); 
} 

Utilizzando che, piuttosto che fare individualmente preventDefault sui link, li si lascia gestire il router di default e fare eccezioni per avere un attributo data-bypass. Nella mia esperienza funziona bene come modello. Non conosco esempi fantastici in giro, ma provarlo da soli non dovrebbe essere troppo difficile. La bellezza di Backbone sta nella sua semplicità;)

Answer 2

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

Answer 3

match() o startsWith() (ES 6) può anche essere utilizzato per il controllo di protocollo. Se si desidera supportare gli URL assoluti per la proprietà pathname, controllare gli url di base entro 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

È possibile impedire il comportamento predefinito di click sul <a> tag in HTML. Basta aggiungere il codice seguente all'interno del tag <script />.

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