Question

我不知道为什么会这样，我花了几个小时研究无济于事。无论如何，这里是注册页面的代码，无论条件是真还是假，都提交表单。我尝试过使用几乎所有验证和提交的变体而且我完全迷失了。

注册-test.php的

    <head>
    <style>
        ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: #333;
            display: inline-block;
        }

        li {
            float: left;
        }

        li a,
        .dropbtn {
            display: block;
            color: white;
            text-align: center;
            padding: 14px 16px;
            text-decoration: none;
            font-size: 28px;
            padding-left: 38px;
            padding-right: 38px;
        }

        li a:hover:not(.active) {
            background-color: darkslategrey;
        }

        .active {
            background-color: red;
        }

        li a:hover,
        .dropdown:hover .dropbtn {
            background-color: darkslategray;
        }

        li.dropdown {
            display: inline-block;
        }

        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
            z-index: 1;
        }

        .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
            text-align: left;
        }

        .dropdown-content a:hover {
            background-color: gray;
        }

        .dropdown:hover .dropdown-content {
            display: inline-block;
        }

        div.user {
            position: absolute;
            right: 120px;
            top 1px;
        }

        div.register {
            position: absolute;
            top: 290px;
            left: 610px;
            padding: 1px;
            font-size: 32px;
        }

        #radio {
            border: 0px;
            width: 5%;
            height: 2em;
        }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js">
        function formNotValid() {
            alert( "Form data is incorrect!" );
        }

        function getEmail(testedemail) {
            $.ajax({
              method: 'GET',
              url: 'Email-Check.php',
              data: {
                targemail: testedemail;
              },
              success: function(data) {
                $('#data').text(data);
              }
            });
        }

        function validateEmail( email ) {
            "use strict";
            var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
            if ( re.test( email ) == true ) {
                getEmail(email);
                var origemail = false;
                <?php
                if ($_SESSION[ 'Orig' ] === true) {
                    echo '<script>var origemail = true;</script>';
                }
                ?>;
                if (origemail === true) {
                    return true;
                }
            } else {
                return false;
            }

        function validatePassword( pass ) {
            "use strict";
            var rgx = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,20}/;
            return rgx.test( pass );
        }

        function validateBirthday( month, day, year ) {
            "use strict";
            var d = new Date();
            var minyear = d.getFullYear() - 13;
            var minmon = d.getMonth() + 1;
            var minday = d.getDay();
            if ( year > minyear ) {
                return false;
            } else if ( year === minyear ) {
                if ( month < minmon ) {
                    return true;
                } else {
                    if ( month === minmon ) {
                        if ( day <= minday ) {
                            return true;
                        } else {
                            return false;
                        }
                    } else {
                        return false;
                    }
                }
            } else {
                return true;
            }
        }

        function validInfo() {
            var User = document.getElementById( 'User' ).value;
            var Pass = document.getElementById( 'Pass' ).value.value;
            var Month = document.getElementById( 'Month' ).value;
            var Day = document.getElementById( 'Day' ).value;
            var Year = document.getElementById( 'Year' ).value;
            if ( ( validatePassword( Pass ) === true ) && ( validateBirthday( Month, Day, Year ) === true ) ) {
                if (validateEmail(User) === true) {
                    return true;
                    document.getElementById('Form').submit;
                } else {
                    formNotValid();
                    return false;
                }
            } else {
                formNotValid();
                return false;
            }
        }
    </script>
</head>

<body>
    <ul>
        <li><a href="Home.php">Search</a>
        </li>
        <li class="dropdown">
            <a href="javascript:void(0)" class="dropbtn">Info</a>
            <div class="dropdown-content">
                <a href="Overview.php">Overview</a>
                <a href="VGDS1-1-2018T&C.pdf">Terms and Conditions</a>
                <a href="VGDS1-1-2018PP.pdf">Privacy Policy</a>
                <li class="dropdown">
                    <a href="javascript:void(0)" class="dropbtn">FAQ/Help</a>
                    <div class="dropdown-content">
                        <a href="Help.php">FAQ/Help</a>
                        <a href="Contact.php">Contact Us</a>
                        <li><a class="active" href="Account.php">Account</a>
                        </li>
    </ul>
    <div class="user">
        <?php 
        if(!isset($_SESSION[ 'loggeduser' ]) || empty($_SESSION[ 'loggeduser' ])) {
            echo 'Welcome, Guest';
            echo '<br><a href="Login.php" style="text-decoration-color:red;">Log in</a>';
        } else {
            echo 'Welcome, ' . $_SESSION[ 'loggeduser' ];
        }
        ?>
    </div>
    <div class="register">
        <form onSubmit="validInfo()" id="Form" name="Form" action="Register-Data.php" method="POST" enctype="multipart/form-data">
            <label>Email:</label>
            <input type="text" placeholder="Enter Email" id="User" name="User" maxlength="30" style="width:352px;height:30px;" autofocus required><br>
            <label>Password:</label>
            <input type="password" placeholder="Enter Password" id="Pass" name="Pass" maxlength="20" style="width:305px;height:30px;" required><br>
            <label>Birthday:</label>
            <select id="Month" name="Month" required>
                <option value="1">January</option>
                <option value="2">February</option>
                <option value="3">March</option>
                <option value="4">April</option>
                <option value="5">May</option>
                <option value="6">June</option>
                <option value="7">July</option>
                <option value="8">August</option>
                <option value="9">September</option>
                <option value="10">October</option>
                <option value="11">November</option>
                <option value="12">December</option>
            </select>
            <select id="Day" name="Day" required>
                <option value="1">1</option>
                <option value="2">2</option>
                <option value="3">3</option>
                <option value="4">4</option>
                <option value="5">5</option>
                <option value="6">6</option>
                <option value="7">7</option>
                <option value="8">8</option>
                <option value="9">9</option>
                <option value="10">10</option>
                <option value="11">11</option>
                <option value="12">12</option>
                <option value="13">13</option>
                <option value="14">14</option>
                <option value="15">15</option>
                <option value="16">16</option>
                <option value="17">17</option>
                <option value="18">18</option>
                <option value="19">19</option>
                <option value="20">20</option>
                <option value="21">21</option>
                <option value="22">22</option>
                <option value="23">23</option>
                <option value="24">24</option>
                <option value="25">25</option>
                <option value="26">26</option>
                <option value="27">27</option>
                <option value="28">28</option>
                <option value="29">29</option>
                <option value="30">30</option>
                <option value="31">31</option>
            </select>
            <select id="Year" name="Year" required>
                <option value="2018">2018</option>
                <option value="2017">2017</option>
                <option value="2016">2016</option>
                <option value="2015">2015</option>
                <option value="2014">2014</option>
                <option value="2013">2013</option>
                <option value="2012">2012</option>
                <option value="2011">2011</option>
                <option value="2010">2010</option>
                <option value="2009">2009</option>
                <option value="2008">2008</option>
                <option value="2007">2007</option>
                <option value="2006">2006</option>
                <option value="2005">2005</option>
                <option value="2004">2004</option>
                <option value="2003">2003</option>
                <option value="2002">2002</option>
                <option value="2001">2001</option>
                <option value="2000">2000</option>
                <option value="1999">1999</option>
                <option value="1998">1998</option>
                <option value="1997">1997</option>
                <option value="1996">1996</option>
                <option value="1995">1995</option>
                <option value="1994">1994</option>
                <option value="1993">1993</option>
                <option value="1992">1992</option>
                <option value="1991">1991</option>
                <option value="1990">1990</option>
                <option value="1989">1989</option>
                <option value="1988">1988</option>
                <option value="1987">1987</option>
                <option value="1986">1986</option>
                <option value="1985">1985</option>
                <option value="1984">1984</option>
                <option value="1983">1983</option>
                <option value="1982">1982</option>
                <option value="1981">1981</option>
                <option value="1980">1980</option>
                <option value="1979">1979</option>
                <option value="1978">1978</option>
                <option value="1977">1977</option>
                <option value="1976">1976</option>
                <option value="1975">1975</option>
                <option value="1974">1974</option>
                <option value="1973">1973</option>
                <option value="1972">1972</option>
                <option value="1971">1971</option>
                <option value="1970">1970</option>
                <option value="1969">1969</option>
                <option value="1968">1968</option>
                <option value="1967">1967</option>
                <option value="1966">1966</option>
                <option value="1965">1965</option>
                <option value="1964">1964</option>
                <option value="1963">1963</option>
                <option value="1962">1962</option>
                <option value="1961">1961</option>
                <option value="1960">1960</option>
                <option value="1959">1959</option>
                <option value="1958">1958</option>
                <option value="1957">1957</option>
                <option value="1956">1956</option>
                <option value="1955">1955</option>
                <option value="1954">1954</option>
                <option value="1953">1953</option>
                <option value="1952">1952</option>
                <option value="1951">1951</option>
                <option value="1950">1950</option>
                <option value="1949">1949</option>
                <option value="1948">1948</option>
                <option value="1947">1947</option>
                <option value="1946">1946</option>
                <option value="1945">1945</option>
                <option value="1944">1944</option>
                <option value="1943">1943</option>
                <option value="1942">1942</option>
                <option value="1941">1941</option>
                <option value="1940">1940</option>
                <option value="1939">1939</option>
                <option value="1938">1938</option>
                <option value="1937">1937</option>
                <option value="1936">1936</option>
                <option value="1935">1935</option>
                <option value="1934">1934</option>
                <option value="1933">1933</option>
                <option value="1932">1932</option>
                <option value="1931">1931</option>
                <option value="1930">1930</option>
                <option value="1929">1929</option>
                <option value="1928">1928</option>
                <option value="1927">1927</option>
                <option value="1926">1926</option>
                <option value="1925">1925</option>
                <option value="1924">1924</option>
                <option value="1923">1923</option>
                <option value="1922">1922</option>
                <option value="1921">1921</option>
                <option value="1920">1920</option>
                <option value="1919">1919</option>
                <option value="1918">1918</option>
                <option value="1917">1917</option>
                <option value="1916">1916</option>
                <option value="1915">1915</option>
                <option value="1914">1914</option>
                <option value="1913">1913</option>
                <option value="1912">1912</option>
                <option value="1911">1911</option>
                <option value="1910">1910</option>
                <option value="1909">1909</option>
                <option value="1908">1908</option>
                <option value="1907">1907</option>
                <option value="1906">1906</option>
                <option value="1905">1905</option>
                <option value="1904">1904</option>
                <option value="1903">1903</option>
                <option value="1902">1902</option>
                <option value="1901">1901</option>
                <option value="1900">1900</option>
            </select>
            <br><label>Select a Gender</label><br>
            <label>M:</label>
            <input type="radio" id="radio" name="Gender" value="Male">
            <label>F:</label>
            <input type="radio" id="radio" name="Gender" value="Female">
            <label>N/A:</label>
            <input type="radio" id="radio" name="Gender" value="Other" checked><br>
            <input type="submit" onSubmit="return validInfo()" style="position:relative;width:400px;height:50px;" value="Register">
        </form>
    </div>
</body>

Answer 1

我已更正您的代码，请查看此更新代码。

我已经更新了以前未正确链接的jquery库链接 更新
我删除了 .value from last ，在此行Pass = document.getElementById('Pass').value;下添加了2次 validInfo（）方法。

还有其他方法可以在提交之前对表单进行验证，例如validate()

<head>
    <style>
        ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: #333;
            display: inline-block;
        }

        li {
            float: left;
        }

        li a,
        .dropbtn {
            display: block;
            color: white;
            text-align: center;
            padding: 14px 16px;
            text-decoration: none;
            font-size: 28px;
            padding-left: 38px;
            padding-right: 38px;
        }

        li a:hover:not(.active) {
            background-color: darkslategrey;
        }

        .active {
            background-color: red;
        }

        li a:hover,
        .dropdown:hover .dropbtn {
            background-color: darkslategray;
        }

        li.dropdown {
            display: inline-block;
        }

        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
            z-index: 1;
        }

        .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
            text-align: left;
        }

        .dropdown-content a:hover {
            background-color: gray;
        }

        .dropdown:hover .dropdown-content {
            display: inline-block;
        }

        div.user {
            position: absolute;
            right: 120px;
            top 1px;
        }

        div.register {
            position: absolute;
            top: 290px;
            left: 610px;
            padding: 1px;
            font-size: 32px;
        }

        #radio {
            border: 0px;
            width: 5%;
            height: 2em;
        }
    </style>
    <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js"></script>
    <script>
        function formNotValid() {
            alert("Form data is incorrect!");
        }

        function getEmail(testedemail) {
            $.ajax({
                method: 'GET',
                url: 'Email-Check.php',
                data: {
                    targemail: testedemail
                }
                ,
                success: function (data) {
                    $('#data').text(data);
                }
            }
            );
        }

        function validateEmail(email) {
            "use strict";
            var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
            if (re.test(email) == true) {
                getEmail(email);
                var origemail = false;
<?php
if ($_SESSION['Orig'] === true) {
    echo '<script>var origemail = true;</script>';
}
?>;
                if (origemail === true) {
                    return true;
                }
            } else {
                return false;
            }
        }

        function validatePassword(pass) {
            "use strict";
            var rgx = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,20}/;
            return rgx.test(pass);
        }

        function validateBirthday(month, day, year) {
            "use strict";
            var d = new Date();
            var minyear = d.getFullYear() - 13;
            var minmon = d.getMonth() + 1;
            var minday = d.getDay();
            if (year > minyear) {
                return false;
            } else if (year === minyear) {
                if (month < minmon) {
                    return true;
                } else {
                    if (month === minmon) {
                        if (day <= minday) {
                            return true;
                        } else {
                            return false;
                        }
                    } else {
                        return false;
                    }
                }
            } else {
                return true;
            }
        }

        function validInfo() {
            var User = document.getElementById('User').value;
            var Pass = document.getElementById('Pass').value;
            var Month = document.getElementById('Month').value;
            var Day = document.getElementById('Day').value;
            var Year = document.getElementById('Year').value;
            if ((validatePassword(Pass) === true) && (validateBirthday(Month, Day, Year) === true)) {
                if (validateEmail(User) === true) {
                    return true;
                    document.getElementById('Form').submit;
                } else {
                    formNotValid();
                    return false;
                }
            } else {
                formNotValid();
                return false;
            }
        }
    </script>
</head>

<body>
    <ul>

        <li class="dropdown">

            <div class="dropdown-content">

                <li class="dropdown">

                    <div class="dropdown-content">

                        </ul>
                        <div class="user">
                            <?php
                            if (!isset($_SESSION['loggeduser']) || empty($_SESSION['loggeduser'])) {
                                echo 'Welcome, Guest';
                                echo '<br><a href="Login.php" style="text-decoration-color:red;">Log in</a>';
                            } else {
                                echo 'Welcome, ' . $_SESSION['loggeduser'];
                            }
                            ?>
                        </div>
                        <div class="register">
                            <form onSubmit="validInfo()" id="Form" name="Form" action="Register-Data.php" method="POST" enctype="multipart/form-data">
                                <label>Email:</label>
                                <input type="text" placeholder="Enter Email" id="User" name="User" maxlength="30" style="width:352px;height:30px;" autofocus required><br>
                                <label>Password:</label>
                                <input type="password" placeholder="Enter Password" id="Pass" name="Pass" maxlength="20" style="width:305px;height:30px;" required><br>
                                <label>Birthday:</label>
                                <select id="Month" name="Month" required>
                                    <option value="1">January</option>
                                    <option value="2">February</option>
                                    <option value="3">March</option>
                                    <option value="4">April</option>
                                    <option value="5">May</option>
                                    <option value="6">June</option>
                                    <option value="7">July</option>
                                    <option value="8">August</option>
                                    <option value="9">September</option>
                                    <option value="10">October</option>
                                    <option value="11">November</option>
                                    <option value="12">December</option>
                                </select>
                                <select id="Day" name="Day" required>
                                    <option value="1">1</option>
                                    <option value="2">2</option>
                                    <option value="3">3</option>
                                    <option value="4">4</option>
                                    <option value="5">5</option>
                                    <option value="6">6</option>
                                    <option value="7">7</option>
                                    <option value="8">8</option>
                                    <option value="9">9</option>
                                    <option value="10">10</option>
                                    <option value="11">11</option>
                                    <option value="12">12</option>
                                    <option value="13">13</option>
                                    <option value="14">14</option>
                                    <option value="15">15</option>
                                    <option value="16">16</option>
                                    <option value="17">17</option>
                                    <option value="18">18</option>
                                    <option value="19">19</option>
                                    <option value="20">20</option>
                                    <option value="21">21</option>
                                    <option value="22">22</option>
                                    <option value="23">23</option>
                                    <option value="24">24</option>
                                    <option value="25">25</option>
                                    <option value="26">26</option>
                                    <option value="27">27</option>
                                    <option value="28">28</option>
                                    <option value="29">29</option>
                                    <option value="30">30</option>
                                    <option value="31">31</option>
                                </select>
                                <select id="Year" name="Year" required>
                                    <option value="2018">2018</option>
                                    <option value="2017">2017</option>
                                    <option value="2016">2016</option>
                                    <option value="2015">2015</option>
                                    <option value="2014">2014</option>
                                    <option value="2013">2013</option>
                                    <option value="2012">2012</option>
                                    <option value="2011">2011</option>
                                    <option value="2010">2010</option>
                                    <option value="2009">2009</option>
                                    <option value="2008">2008</option>
                                    <option value="2007">2007</option>
                                    <option value="2006">2006</option>
                                    <option value="2005">2005</option>
                                    <option value="2004">2004</option>
                                    <option value="2003">2003</option>
                                    <option value="2002">2002</option>
                                    <option value="2001">2001</option>
                                    <option value="2000">2000</option>
                                    <option value="1999">1999</option>
                                    <option value="1998">1998</option>
                                    <option value="1997">1997</option>
                                    <option value="1996">1996</option>
                                    <option value="1995">1995</option>
                                    <option value="1994">1994</option>
                                    <option value="1993">1993</option>
                                    <option value="1992">1992</option>
                                    <option value="1991">1991</option>
                                    <option value="1990">1990</option>
                                    <option value="1989">1989</option>
                                    <option value="1988">1988</option>
                                    <option value="1987">1987</option>
                                    <option value="1986">1986</option>
                                    <option value="1985">1985</option>
                                    <option value="1984">1984</option>
                                    <option value="1983">1983</option>
                                    <option value="1982">1982</option>
                                    <option value="1981">1981</option>
                                    <option value="1980">1980</option>
                                    <option value="1979">1979</option>
                                    <option value="1978">1978</option>
                                    <option value="1977">1977</option>
                                    <option value="1976">1976</option>
                                    <option value="1975">1975</option>
                                    <option value="1974">1974</option>
                                    <option value="1973">1973</option>
                                    <option value="1972">1972</option>
                                    <option value="1971">1971</option>
                                    <option value="1970">1970</option>
                                    <option value="1969">1969</option>
                                    <option value="1968">1968</option>
                                    <option value="1967">1967</option>
                                    <option value="1966">1966</option>
                                    <option value="1965">1965</option>
                                    <option value="1964">1964</option>
                                    <option value="1963">1963</option>
                                    <option value="1962">1962</option>
                                    <option value="1961">1961</option>
                                    <option value="1960">1960</option>
                                    <option value="1959">1959</option>
                                    <option value="1958">1958</option>
                                    <option value="1957">1957</option>
                                    <option value="1956">1956</option>
                                    <option value="1955">1955</option>
                                    <option value="1954">1954</option>
                                    <option value="1953">1953</option>
                                    <option value="1952">1952</option>
                                    <option value="1951">1951</option>
                                    <option value="1950">1950</option>
                                    <option value="1949">1949</option>
                                    <option value="1948">1948</option>
                                    <option value="1947">1947</option>
                                    <option value="1946">1946</option>
                                    <option value="1945">1945</option>
                                    <option value="1944">1944</option>
                                    <option value="1943">1943</option>
                                    <option value="1942">1942</option>
                                    <option value="1941">1941</option>
                                    <option value="1940">1940</option>
                                    <option value="1939">1939</option>
                                    <option value="1938">1938</option>
                                    <option value="1937">1937</option>
                                    <option value="1936">1936</option>
                                    <option value="1935">1935</option>
                                    <option value="1934">1934</option>
                                    <option value="1933">1933</option>
                                    <option value="1932">1932</option>
                                    <option value="1931">1931</option>
                                    <option value="1930">1930</option>
                                    <option value="1929">1929</option>
                                    <option value="1928">1928</option>
                                    <option value="1927">1927</option>
                                    <option value="1926">1926</option>
                                    <option value="1925">1925</option>
                                    <option value="1924">1924</option>
                                    <option value="1923">1923</option>
                                    <option value="1922">1922</option>
                                    <option value="1921">1921</option>
                                    <option value="1920">1920</option>
                                    <option value="1919">1919</option>
                                    <option value="1918">1918</option>
                                    <option value="1917">1917</option>
                                    <option value="1916">1916</option>
                                    <option value="1915">1915</option>
                                    <option value="1914">1914</option>
                                    <option value="1913">1913</option>
                                    <option value="1912">1912</option>
                                    <option value="1911">1911</option>
                                    <option value="1910">1910</option>
                                    <option value="1909">1909</option>
                                    <option value="1908">1908</option>
                                    <option value="1907">1907</option>
                                    <option value="1906">1906</option>
                                    <option value="1905">1905</option>
                                    <option value="1904">1904</option>
                                    <option value="1903">1903</option>
                                    <option value="1902">1902</option>
                                    <option value="1901">1901</option>
                                    <option value="1900">1900</option>
                                </select>
                                <br><label>Select a Gender</label><br>
                                <label>M:</label>
                                <input type="radio" id="radio" name="Gender" value="Male">
                                <label>F:</label>
                                <input type="radio" id="radio" name="Gender" value="Female">
                                <label>N/A:</label>
                                <input type="radio" id="radio" name="Gender" value="Other" checked><br>
                                <input type="submit" onSubmit="return validInfo()" style="position:relative;width:400px;height:50px;" value="Register">
                            </form>
                        </div>
                        </body>

Answer 2

您遗失了</li>中的多个</div>和<ul>个标签以及</script>中的<title>和<head>。在;的ajax调用中，有一个分号targemail: testedemail位于错误的位置。您的某个功能也缺少}。要取消automatic submit event的{{1}}我给了一个submit button按钮，在id中为该按钮做了onclick event我使用了jQuery

以下是代码（尝试底部的代码段）：

e.prevenDefault()

// prevent default action of submit button
$('#submitButton').on('click', function(e)
{
  e.preventDefault();
  validInfo();
});

function formNotValid()
{
  alert( "Form data is incorrect!" );
}

function getEmail(testedemail)
{
  $.ajax(
  {
    method: 'GET',
    url: 'Email-Check.php',
    data:
    {
      targemail: testedemail
    },
    success: function(data)
    {
      $('#data').text(data);
    }
  });
}

function validateEmail( email )
{
  "use strict";
  var re = /^(([^<>()[\]\\.,;:\s@\"]+(\.[^<>()[\]\\.,;:\s@\"]+)*)|(\".+\"))@((\[[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\.[0-9]{1,3}\])|(([a-zA-Z\-0-9]+\.)+[a-zA-Z]{2,}))$/;
  if ( re.test( email ) == true )
  {
    getEmail(email);
    var origemail = false;

    if (origemail === true)
    {
      return true;
    }
  }
  else
  {
      return false;
  }
}

function validatePassword( pass )
{
  "use strict";
  var rgx = /(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,20}/;
  return rgx.test( pass );
}

function validateBirthday( month, day, year )
{
  "use strict";;
  var d = new Date();
  var minyear = d.getFullYear() - 13;
  var minmon = d.getMonth() + 1;
  var minday = d.getDay();
  if ( year > minyear )
  {
    return false;
  }
  else if ( year === minyear )
  {
    if ( month < minmon ) return true;
    else
    {
       if ( month === minmon )
       {
         if ( day <= minday ) return true;
       }
    }
  }
  return true;
}
function validInfo()
{
  var User = document.getElementById( 'User' ).value;
  var Pass = document.getElementById( 'Pass' ).value;
  var Month = document.getElementById( 'Month' ).value;
  var Day = document.getElementById( 'Day' ).value;
  var Year = document.getElementById( 'Year' ).value;

  if ( ( validatePassword( Pass ) === true ) && ( validateBirthday( Month, Day, Year ) === true ) )
  {
    if (validateEmail(User) === true)
    {
      document.getElementById('Form').submit;
      return true;
    }
    else
    {
      formNotValid();
      return false;
    }
  }
  else
  {
    formNotValid();
    return false;
  }
}

ul {
            list-style-type: none;
            margin: 0;
            padding: 0;
            overflow: hidden;
            background-color: #333;
            display: inline-block;
        }

        li {
            float: left;
        }

        li a,
        .dropbtn {
            display: block;
            color: white;
            text-align: center;
            padding: 14px 16px;
            text-decoration: none;
            font-size: 28px;
            padding-left: 38px;
            padding-right: 38px;
        }

        li a:hover:not(.active) {
            background-color: darkslategrey;
        }

        .active {
            background-color: red;
        }

        li a:hover,
        .dropdown:hover .dropbtn {
            background-color: darkslategray;
        }

        li.dropdown {
            display: inline-block;
        }

        .dropdown-content {
            display: none;
            position: absolute;
            background-color: #f9f9f9;
            min-width: 160px;
            box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
            z-index: 1;
        }

        .dropdown-content a {
            color: black;
            padding: 12px 16px;
            text-decoration: none;
            display: block;
            text-align: left;
        }

        .dropdown-content a:hover {
            background-color: gray;
        }

        .dropdown:hover .dropdown-content {
            display: inline-block;
        }

        div.user {
            position: absolute;
            right: 120px;
            top 1px;
        }

        div.register {
            position: absolute;
            top: 290px;
            left: 610px;
            padding: 1px;
            font-size: 32px;
        }

        #radio {
            border: 0px;
            width: 5%;
            height: 2em;
        }

无论验证条件如何，表单都会提交，并形成事件监听器

2 个答案: