繁体   English   中英

表单提交后重定向

[英]Redirect After Form Submit

我有一个表单设置和一个javascript文件(如下所示),我想验证输入,然后重定向到另一个网站(index.html)。 验证工作正常,但我无法弄清楚如何使表单重定向到所需页面,而不仅仅是显示回邮。 表单发布到一个php文件(我无法访问),我希望该文件的返回然后显示在index.html上。

形成:

    <form name="form" action="register.php" onsubmit="return validateInput()" method="POST" >
      <fieldset>
        <legend>Personal Details</legend>
        <label>Name</label><br>
        <input type="text" name="name"><br><br>
        <label>Email</label><br>
        <input type="text" name="email"><br><br>
        <label>Date of Birth</label><br>
        <input type="text" name="dob"><br>
      </fieldset>
      <input type="submit" name="submit"> <input type="reset" name="reset">
    </form>

JavaScript文件:

 function validateInput() {

    var check = document.forms["form"].elements;

    for (var i = 0; i < check.length; i++) {
        var test = check[i];

        if (test.type === "text" && test.value === "") {
            displayMsg("Please fill out all fields" +test.innerHTML);
            return false;
        }
        if (test.type === "date") {
            var pattern = /^\d{1,2}\/\d{1,2}\/\d{4}$/;

            if (!test.value.match(pattern)) {
                displayMsg("Please enter a valid date of birth");
                return false;
            }
        }
        else if (test.name === "email") {
            var re = /^[\w\-\.\+]+\@[a-zA-Z0-9\.\-]+\.[a-zA-z0-9]{2,4}$/;

            if (!test.value.match(re)) {
                displayMsg("Please enter a valid email address");
                return false;
            }
        }
    }
    return true;
}

function displayMsg(msg) {
    var ele = document.getElementById("msg");
    ele.className = "show";
    ele.innerHTML = "<p>" + msg + "</p>";
}

window.onload = function() {
    var check = document.forms["form"].elements;
    for (var i = 0; i < check.length; i++) {
        check[i].addEventListener('click', function() {
            var ele = document.getElementById("msg");

            if(ele.className != "hide") {
                ele.className = "hide";
            }
        });
    }
}

而不是return true; 您可以使用window.location.href设置所需的位置,并使用return false; 以防止默认提交表单:

function validateInput() {
    ....
    window.location.href = 'index.html';
    return false;
}

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM