Javascript - jQuery preventDefault Methode

Question

Ich bin ein Javascript-Noob, also Entschuldigungen, wenn diese Frage nicht für dieses Forum ist. Ich versuche, jQuery-Methode zu verstehen:

e.preventDefault()

Im folgenden Code, wenn Dreher eine Liste in einer anderen Form es notwendig ist für uns in der Lage sein, um die Elemente zu bewegen . Ich würde gerne wissen, was genau dort passiert und welche Standardaktionen verhindern wir?

$('#move').click(
    function(e) { 
    $('#list1 > option:selected').appendTo('#list2'); 
    e.preventDefault(); 
    }); 

$('#moveAll').click(
function(e) { 
    $('#list1 > option').appendTo('#list2'); 
    e.preventDefault(); 
}); 

$('#removeAll').click(
    function(e) { 
    $('#list2 > option').appendTo('#list1'); 
    e.preventDefault(); 
    }); 

Answer 1

Also im Grunde, wenn Sie Hyper-Link klicken postet es zurück zur URL oder # Wenn wir e.preventDefault() Funktion hinzufügen, wird jQuery Standardaktion von Click-Ereignis verhindern.

Wenn Sie auf #move klicken, wird die Seite nicht aktualisiert, aber die Aktion innerhalb der Funktion wird ausgeführt.

Hoffe, das hilft!

Answer 2

Es wird weitere Standardaktion für das aktuelle Ereignis verhindern.

z. Klicken auf den Link folgt href des Elements. e.preventDefault(); verhindert folgenden Link und Sie werden nicht umgeleitet.

Weitere Informationen here

$(document).ready(function() { 
 
    $('#a1').click(function(e) { 
 
    e.preventDefault(); 
 

 
    alert('Clicked, but not following link.'); 
 
    }); 
 
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<a href="http://google.com" id="a1">Link with preventDefault</a> 
 
<br/> 
 
<a href="http://google.com" id="a2">Link without preventDefault</a>

Answer 3

Vor allem e.preventDefault() sollten erste Linie sein, wenn die Definition, was alles in Funktion geschehen wird.

$('#move').click(
    function(e) { 
    e.preventDefault(); 
    $('#list1 > option:selected').appendTo('#list2'); 
    }); 

$('#moveAll').click(
function(e) { 
    e.preventDefault(); 
    $('#list1 > option').appendTo('#list2'); 
}); 

$('#removeAll').click(
    function(e) { 
    e.preventDefault(); 
    $('#list2 > option').appendTo('#list1'); 
    }); 

preventDefault Zweitens verhindert, dass die Standardfunktion des Elements, an dem es angewendet wird.

Für Ex:

<a href="#" class="clickBtn"> 

Wenn Sie Ereignis auf das obere <a> standardmäßig ausgelöst wird es zu dokumentieren, um nach oben und wird eine # in url zeigen und dann feuern Sie funktionieren aber wenn Sie verwenden preventDefault dann Die Standardfunktion der Verknüpfung wird verhindert.