Usando JQuery: evitando que se envíe el formulario
¿Cómo evito que se envíe un formulario usando jquery?
Intenté todo; vea 3 opciones diferentes que probé a continuación, pero no funcionó:
$(document).ready(function() {
//option A
$("#form").submit(function(e){
e.preventDefault();
});
//option B
$("#form").submit(function(e){
stopEvent(e);
});
//option C
$("#form").submit(function(){
return false;
});
});
¿Qué podría estar mal?
Actualización: aquí está mi html:
<form id="form" class="form" action="page2.php" method="post">
<!-- tags in the form -->
<p class="class2">
<input type="submit" value="Okay!" />
</p>
</form>
¿Hay algo malo aquí?
Destacan dos cosas:
- Es posible que el nombre de su formulario no sea
form. En lugar de eso, consulte la etiqueta soltando el #. Además,
e.preventDefaultla sintaxis JQuery es correcta, por ejemplo//option A $("form").submit(function(e){ e.preventDefault(); });
La opción C también debería funcionar. No conozco la opción B
Un ejemplo completo:
<html>
<head>
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js"></script>
<script type='text/javascript'>
$(document).ready(function() {
//option A
$("form").submit(function(e){
alert('submit intercepted');
e.preventDefault(e);
});
});
</script>
</head>
<body>
<form action="http://google.com" method="GET">
Search <input type='text' name='q' />
<input type='submit'/>
</form>
</body>
</html>
Probablemente tenga pocos formularios en la página y el uso de $('form').submit() agrega este evento a la primera aparición del formulario en su página. Utilice el selector de clases en su lugar o pruebe esto:
$('form').each(function(){
$(this).submit(function(e){
e.preventDefault();
alert('it is working!');
return false;
})
})
o mejor versión del mismo:
$(document).on("submit", "form", function(e){
e.preventDefault();
alert('it works!');
return false;
});
Para evitar el uso predeterminado/prevenir el envío de formularios
e.preventDefault();
Para detener el uso de difusión de eventos
e.stopPropagation();
Para evitar el envío de formularios, 'devolver falso' también debería funcionar.
