个人中心
gpt4 book ai didi

javascript - 点击 'Confirm'后没有出现警告窗口

转载 作者：行者123 更新时间：2023-12-02 17:36:40 28 4
gpt4 key购买 nike

这是我的作业，这是我第一次做表单验证。以下代码分别是我的HTML代码和JavaScript代码。

HTML 代码:

<html>

<head>
    <script src="validate_form.js" type="text/javascript"></script>
</head>

<body>
    <table>
        <form name="register" method="post" action="">
            <tr><td>First Name:</td><td><input type="text" id="firstname"/></td></tr>
            <tr><td>Surname:</td><td><input type="text" id="surname"/></td></tr>
            <tr><td>Gender:</td><td><input type="text" id="gender"/></td></tr>
            <tr><td>Birthday - Day:</td><td><input type="text" id="dob"/></td></tr>
            <tr><td>Month:</td><td><input type="text" id="month"/></td></tr>
            <tr><td>Year:</td><td><input type="text" id="year"/></td></tr>
            <tr><td>Yahoo ID:</td><td><input type="text" id="yahoo_id"/></td></tr>
            <tr><td>Password:</td><td><input type="text" id="password"/></td></tr>
            <tr><td>Retype password:&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;</td>
            <td><input type="text" id="retype"/></td></tr>
            <tr><td>Question 1:</td><td><input type="text" id="q1"/></td></tr>
            <tr><td>Answer 1:</td><td><input type="text" id="a1"/></td></tr>
            <tr><td>Question 2:</td><td><input type="text" id="q2"/></td></tr>
            <tr><td>Answer 2:</td><td><input type="text" id="a2"/></td></tr>
            <tr><td><input type="submit" value="Confirm" onclick="validate_form ()"/></td><td></td></tr>
        </form>
    </table>
</body>



</html>

JavaScript 代码:

function validate_form () 

{
    var first = document.getElementById("firstname").value;  /*get value from the IDs*/
    var sur = document.getElementById("surname").value;
    var sex = document.getElementById("gender").value;
    var day = document.getElementById("dob").value;
    var month = document.getElementById("month").value;
    var year = document.getElementById("year").value;
    var yahooid = document.getElementById("yahoo_id").value;
    var ps = document.getElementById("password").value;
    var retype_ps = document.getElementById("retype").value;
    var ques1 = document.getElementById("q1").value;
    var ans1 = document.getElementById("a1").value;
    var ques2 = document.getElementById("q2").value;
    var ans2 = document.getElementById("a2").value;

    var error = "";                              /*Regular expressions for matching purpose*/
    var val_name = /^[a-zA-Z]{1,}$/;
    var val_dob = /^[0-9]$/;
    var val_yahoo = /^[a-zA-Z0-9_]$/;
    var val_pass = /^[a-zA-Z0-9]$/;

    if (first == null || surname == null || !val_name.test(first)  || !val_name.test(sur) ) /*Validate firstname and surname*/                   

    {
        error += "Invalid firstname and/or surname.\n";
    }

    else if (sex == null) /*Validate gender*/ 

    {
        error += "Invalid gender.\n";
    }

    else if  (day == null || !val_dob.test(day)) /*Validate day of birth*/ 

    {
        error += "Invalid day of birth.\n";
    }

    else if  (month == null) /*Validate month of birth*/ 

    {
        error += "Invalid month of birth.\n";
    }

    else if (year == null || !val_dob.test(year)) /*Validate year of birth*/ 

    {
        error += "Invalid year of birth.\n";
    }

    else if (yahooid == null || !val_yahoo.test(yahooid)) /*Validate Yahoo Id*/ 

    {
        error += "Invalid yahoo Id.\n";
    }

    else if (ps == null || !val_pass.test(ps)) /*Validate password entered*/ 

    {
        error += "Invalid password.\n";
    }

    else if (retype_ps == null || retype_ps != password) /*Validate retype password*/ 

    {
        error += "Retype password is different form password.\n";
    }

    else if (ques1 == null || ans1 == null || ques2 == null || ans2 == null) /*Validate question 1, answer 1, question 2, and answer 2*/ 

    {
        error += "Invalid Question 1 and/or Answer 1 and/or Question 2 and/or Answer 2.\n";
    }

    else if (error == "") /*If no error, display the following message*/ 

    {
        alert("Thank you for your registration.");
    }

    else /*If there are errors, display all the error messages*/

    {
        alert(error);
    }
}

那么，现在的问题是，在没有出现警告窗口之前，代码出了什么问题？希望能彻底指出错误，因为我对 JavaScript 还很陌生。

最佳答案

当您连接变量 error 中的消息时，您必须将最后一个 else if 作为独立的 if:

...
else if (ques1 == null || ans1 == null || ques2 == null || ans2 == null)
{
  error += "Invalid Question 1 and/or Answer 1 and/or Question 2 and/or Answer 2.\n";
}

if (error == "") /*If no error, display the following message*/ 
{
  alert("Thank you for your registration.");
}
else /*If there are errors, display all the error messages*/
{
  alert(error);
}

注意:我还注意到检查密码重复的 if 中存在错误，您已更改其名称(您将其命名为 password 而不是 ps)。

我在 JSFiddle 中上传了两个示例: http://fiddle.jshell.net/kcDBU/

这个只有 if 而不是 else if: http://fiddle.jshell.net/kcDBU/1/

关于javascript - 点击 'Confirm'后没有出现警告窗口，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/22562712/

28 4 0
文章推荐： javascript - 使用 RegExp 查找、复制和粘贴标签内容
文章推荐： javascript - Javascript 中函数的嵌套调用
文章推荐： javascript - 使用 RegEx 替换 Div 字符串
文章推荐： javascript - 我可以在不更新页面的情况下更改 URL 吗？
行者123
个人简介

我是一名优秀的程序员,十分优秀！

滴滴打车优惠券免费领取
滴滴打车优惠券
全站热门文章
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com