在设计用户身份验证之前preventDefault

Question

我的索引中有一个用户注册表格的模态。 当buttom保存单击时，我创建一个JavaScript。 当用户出现错误时，警报会显示在模态中，但会重定向其他页面。

当用户出错时，我不会重定向页面。

这是javascript和ajax。

$("#update").click(function(e){
                
                
                
                if(!validarEmail()){
                    $("#divalerta").addClass("alert-danger");
                    $("#divalerta").removeClass("alert-success");
                    var j = $("<p id=\"alerta\"><span class=\"glyphicon glyphicon-exclamation-sign\"></span>Formato de email incorrecto</p>");
                    mostrarAlerta(j);   
                    e.preventDefault();
                    return;             
                }
                if($("#newpass").val() != $("#retypepass").val()){
                    $("#divalerta").addClass("alert-danger");
                    $("#divalerta").removeClass("alert-success");
                    var j = $("<p id=\"alerta\"><span class=\"glyphicon glyphicon-exclamation-sign\"></span>Las contraseñas no concuerdan</p>");
                    mostrarAlerta(j);                
                    e.preventDefault();
                    return;
                }
                
                var datos = {};
                datos['accion'] = "ingresar";
                datos['nombre'] = $("#nombre").val();
                datos['apellido'] = $("#apellido").val();
                datos['email'] = $("#email").val();
                datos['pass'] = $("#newpass").val();
                //var params={'datos' : datos};

                $.ajax({
                    method: "POST",
                    async: false,
                    data: datos,
                    url: "/",
                    success: function(response){
                        var arr = response.split("-");
                        if(arr[0]=="ok"){
                            $("#divalerta").removeClass("alert-danger");
                            $("#divalerta").addClass("alert-success"); 
                            $("#update").prop('disabled',true);                                
                        }
                        else{
                            $("#divalerta").addClass("alert-danger");
                            $("#divalerta").removeClass("alert-success");
                        }
                        var j = $("<p id=\"alerta\"><span class=\"glyphicon glyphicon-exclamation-sign\"></span>"+arr[1]+".</p>");
                        mostrarAlerta(j);
                    }

                });
            });

Answer 1

你可以做这样的事情

＆＃13;

＆＃13;

<form onsubmit="return validator()"

var validator = function(){
                
                
                
                if(!validarEmail()){
                    $("#divalerta").addClass("alert-danger");
                    $("#divalerta").removeClass("alert-success");
                    var j = $("<p id=\"alerta\"><span class=\"glyphicon glyphicon-exclamation-sign\"></span>Formato de email incorrecto</p>");
                    mostrarAlerta(j);             
                    return false;             
                }
                if($("#newpass").val() != $("#retypepass").val()){
                    $("#divalerta").addClass("alert-danger");
                    $("#divalerta").removeClass("alert-success");
                    var j = $("<p id=\"alerta\"><span class=\"glyphicon glyphicon-exclamation-sign\"></span>Las contraseñas no concuerdan</p>");
                    mostrarAlerta(j);
                    return false;
                }
                
                var datos = {};
                datos['accion'] = "ingresar";
                datos['nombre'] = $("#nombre").val();
                datos['apellido'] = $("#apellido").val();
                datos['email'] = $("#email").val();
                datos['pass'] = $("#newpass").val();
                //var params={'datos' : datos};

                $.ajax({
                    method: "POST",
                    async: false,
                    data: datos,
                    url: "/",
                    success: function(response){
                        var arr = response.split("-");
                        if(arr[0]=="ok"){
                            $("#divalerta").removeClass("alert-danger");
                            $("#divalerta").addClass("alert-success"); 
                            $("#update").prop('disabled',true);                                
                        }
                        else{
                            $("#divalerta").addClass("alert-danger");
                            $("#divalerta").removeClass("alert-success");
                        }
                        var j = $("<p id=\"alerta\"><span class=\"glyphicon glyphicon-exclamation-sign\"></span>"+arr[1]+".</p>");
                        mostrarAlerta(j);
                    }

                });
            return false;
            });

＆＃13;

＆＃13;

＆＃13;

这样，表单永远不会重新加载。您可以根据自己的选择修改此方法，但只要知道onsubmit属性返回false就不允许重新加载表单。我希望这会有所帮助。

Answer 2

将return替换为return false，它将起到作用。