表单页未等待javascript sweetAlert的响应？_Javascript_Php_Sweetalert

表单页未等待javascript sweetAlert的响应？

javascript php

表单页未等待javascript sweetAlert的响应？,javascript,php,sweetalert,Javascript,Php,Sweetalert,Registration.php <head> <script> function myFunction() { var userName=document.getElementById('fname').value; var userLastName=document.getElementById('lname').value; var userEmail=document.getElementById('emai

Registration.php

<head>
<script>
    function myFunction() {
        var userName=document.getElementById('fname').value;
        var userLastName=document.getElementById('lname').value;
        var userEmail=document.getElementById('email').value;
        var userContact=document.getElementById('contact').value;
       //alert(userContact);
       var phoneno = /^\d{10}$/;
        var letters=/^[A-Za-z]+$/;

       if (letters.test(userName)) {

       }else{
       // swal("First Name contain only letters and whitespaces");
       swal({
        title: "Error!",
        text: "First Name contain only letters and whitespaces",
        type: "error",
        confirmButtonText: "OK"
        })
        exit;
       }

       if (letters.test(userLastName)) {

       }else{
        //alert("Last name contains only letters and whitespaces");
        swal({
            title:"Error!",
            text:"Last name contains only letters and whitespaces",
            type:"error",
            confirmButtonText:"OK"

            })
        exit;
       }
           if (phoneno.test(userContact)) {

       }else{
        //alert(" contact number is of 10 digit");
        swal({
            title:"Error!",
            text:"contact number is of 10 digit",
            type:"error",
            confirmButtonText: "OK"
            })
        exit;
       }
    ///alert("succes");
       //swal({
       // title:"Congratulation!",
       // text:"You are successfully Registreared.",
       // type:"success",
       // confirmButtonText: "OK",
       // })
      swal('Congratulations!','Your are successfully Register','success');

    }
</script>
</head>
    <body>
       <div id='Registration'>
    <form  action='Insert.php' method='post'>
    <table id='myTable'>
        <tr>
            <td id='tableName' colspan='2' style='text-align: center'>Registration</td>
    </tr>
    <tr>
        <td>First Name: </td>
        <td><input  type='text' id='fname' name='fname' required></td>
    </tr>
    <tr>
        <td>Last Name:</td>
        <td><input type='text' id='lname' name='lname' required></td>
    </tr>
    <tr>
        <td>Email:</td>
        <td><input type='email' id='email' name='email' required></td>
    </tr>
    <tr>
        <td>Contact:</td>
        <td><input type='text' id='contact' name='contact' required></td>
    </tr>
    <tr>
        <td colspan='2' style='text-align: center'><input  type='submit' id='submit' value='SUBMIT' name='submit' onclick='myFunction()'></td>
    </tr>
</table>
</form>
</div>
 <body>


函数myFunction（）{
var userName=document.getElementById（'fname'）。值；
var userLastName=document.getElementById（'lname'）.value；
var userEmail=document.getElementById（'email'）。值；
var userContact=document.getElementById（'contact'）。值；
//警报（用户联系）；
var phoneno=/^\d{10}$/；
变量字母=/^[A-Za-z]+$/；
if（字母测试（用户名））{
}否则{
//swal（“名字只包含字母和空格”）；
游泳({
标题：“错误！”，
文本：“名字只包含字母和空格”，
键入：“错误”，
confirmButtonText：“好的”
})
出口
}
if（letters.test（userLastName））{
}否则{
//警报（“姓氏仅包含字母和空格”）；
游泳({
标题：“错误！”，
文本：“姓氏仅包含字母和空格”，
键入：“错误”，
confirmButtonText：“好的”
})
出口
}
if（电话号码测试（用户联系））{
}否则{
//警报（“联系人号码为10位”）；
游泳({
标题：“错误！”，
文本：“联系人号码为10位”，
键入：“错误”，
confirmButtonText：“好的”
})
出口
}
///警惕（“成功”）；
//游泳({
//标题：“恭喜！”，
//文本：“您已成功注册。”，
//键入：“成功”，
//confirmButtonText：“确定”，
// })
swal（‘恭喜！’、‘您成功注册’、‘成功’）；
}
登记处
名字：
姓氏：
电邮：
联系人：

这是我的sweetAlert函数，它可以很好地处理错误，但如果成功，它就不能正常工作。为了获得成功，它迫不及待地要得到sweetAlert的响应。他们的表单action='insert.php'method='post'有问题吗？

请给我一个合适的解决方案好吗

php没有任何功能

这是表单提交的正常流程。一旦执行了

onclick

处理程序的最后一行，浏览器就会开始将表单发送到服务器。任何本机浏览器对话框，如

警报

都可以暂停此过程，但没有自定义js警报。如果要等到用户关闭警报，则应阻止表单提交并手动提交

为了防止表单提交（默认行为），您应该从

onclick

处理程序中

返回false

，这是一种可能的方法

要手动提交表单，请使用

form.submit（）

方法

使用

sval

函数的第二个参数添加回调，该回调将在用户关闭成功对话框后执行-

因此，结果代码可能如下所示：

您还需要更新html代码：

首先，您应该为

submit

按钮更新

onclick

事件处理程序，以防止出现默认行为-

onclick='myFunction（）；返回false；'


其次，您应该将submit
按钮重命名为smth。类似于send
可以调用默认的表单。submit
方法。否则，表单。提交
将引用您的按钮-
您的原始脚本还包含一个错误：javascript
没有内置的exit
功能。要跳过函数代码其余部分的执行并立即返回控件，请使用return false语句
function myFunction() {
    var userName=document.getElementById('fname').value;
    var userLastName=document.getElementById('lname').value;
    var userEmail=document.getElementById('email').value;
    var userContact=document.getElementById('contact').value;

    var form = document.getElementById('myForm');
    var onDialogClose = function () {
        console.log(form);
        form.submit();
    };

    var phoneno = /^\d{10}$/;
    var letters=/^[A-Za-z]+$/;

    if (!letters.test(userName)) {
        swal({
            title: "Error!",
            text: "First Name contain only letters and whitespaces",
            type: "error",
            confirmButtonText: "OK"
        });
        return;
    }

    if (!letters.test(userLastName)) {
        swal({
            title:"Error!",
            text:"Last name contains only letters and whitespaces",
            type:"error",
            confirmButtonText:"OK"

        });
        return;
    }

    if (!phoneno.test(userContact)) {
        swal({
            title:"Error!",
            text:"contact number is of 10 digit",
            type:"error",
            confirmButtonText: "OK"
        })
        return;
    }

    swal({
        title: 'Congratulations',
        text: 'Your are successfully Register',
        type: 'success'
    }, onDialogClose);
}