"on" preventDefault

Question

Cosa mi manca qui?

Si prega di notare: jQuery Mobile è usato

• DEMO using preventDefault

• DEMO using return false

se uso preventDefault il caricamento della pagina, come se avessi appena link e nessuno script, quando Ho cambiato per restituire false (che ho sempre usato per il gestore di eventi JS onclick), funziona come previsto. Ho già controllato altri post e tutti usano .click e tutti suggeriscono preventDefault.

$(document).ready(function() { 
    $("#leftdiv a").on("click",function(e) { 
    $("#rightDiv").load(this.href); 
    return false; // I was sure preventDefault would work 
    }); 
}); 

HTML

<div id="leftdiv" style="position:absolute;padding-right:5%; overflow:scroll;"> 
<a href="page1.htm">Launch page 1</a><br /> 
<a href="page2.htm">Launch page 2</a> 
</div> 

<div id="rightDiv" style="padding-left:30%"></div> 

Answer 1

e.preventDefault(); 

non ha funzionato?

• http://api.jquery.com/event.preventDefault/

$('a').on("click",function(e){ 
    //do something 
    e.preventDefault(); 
}); 

Mettere e.preventDefault(); sulla parte superiore o sulla fine del codice non importa normalmente. C'è anche il metodo e.stop() credo. Ma perché non ti attacchi con return false; quando lavora per te?

Dalla documentazione cellulare jQuery:

Annullamento di un comportamento del clic elementi di default

applicazioni possono chiamare preventDefault() su un evento VCLIC di annullare il comportamento predefinito fare clic su di un elemento . Sui dispositivi basati sul mouse, chiamare preventDefault() su un evento vclick equivale a chiamare preventDefault() sull'evento di clic reale durante la fase di evento bolla. Nei dispositivi basati su tocco , è un po 'più complicato poiché l'evento di clic effettivo è inviato circa 300ms dopo l'invio dell'evento vclick. Per i dispositivi touch , la chiamata preventDefault() su un evento vclick attiva il codice nel plug-in vmouse che tenta di catturare l'evento click successivo che viene inviato dal browser, durante la fase dell'evento di acquisizione e chiamate preventDefault() e stopPropagation() su di esso. Come accennato in l'avviso sopra, a volte è difficile abbinare un evento di tocco con il corrispondente evento del mouse perché gli obiettivi possono essere diversi. Per il motivo , il plugin vmouse torna anche a provare a identificare un evento click corrispondente per coordinate. Esistono ancora casi in cui l'identificazione di destinazione e coordinate non riesce, che produce l'evento click che viene inviato e attiva l'azione predefinita dell'elemento o nel caso in cui il contenuto sia stato spostato o sostituito, attivando un clic su un elemento diverso.Se avviene regolarmente per un dato elemento/controllo, noi suggeriamo di utilizzare il clic per attivare l'azione.

function() { 
    return false; 
} 

// IS EQUAL TO 

function(e) { 
    e.preventDefault(); 
    e.stopPropagation(); 
} 

Fonte:http://css-tricks.com/return-false-and-prevent-default/

Sembra inoltre che .on() isn supportato anche come document.ready non è supportato

Fonte:http://jquerymobile.com/test/docs/api/events.html

Answer 2

Questo potrebbe fornire un soluzione, ma mi mancano informazioni per spiegare perché . Recentemente ho sono imbattuto nel problema in cui preventDefault non funzionava in codice simile, e la questione sta nella delega dal $(document) vs $('body') provare quanto segue:

<a href="http://stackoverflow.com" id="test1">Test 1</a> 
<a href="http://stackoverflow.com" id="test2">Test 2</a> 
<script> 
    $('body').on('click', '#test1', function(e) { 
     e.preventDefault(); 
     alert('hi 1'); 
    }); 

    $(document).on('click', '#test2', function(e) { 
     e.preventDefault(); 
     alert('hi 2'); 
    }); 
</script> 

Questo non accade invece con jQuery 3.2.1, posso solo confermare questo è un problema con 2.1.7