如何阻止表单提交

时间:2017-05-08 06:26:34

标签: forms input submit

<head>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <title>JSP Page</title>
    <script type="text/javascript">

用于验证码

function drawcap() 
 {

 var captcha=Math.ceil(Math.random()*1000000);
      document.getElementById("txtdraw").value=captcha;  
        }

提交表格

        function validate()
        {
            var str1=document.getElementById('txtdraw');
            var str2=document.getElementById('txtinput');
            if(str1==str2){    
            return true;}
            else{
            alert("fill correct captcha"); 
            return false;
        }}
        </script>
    </head>
    <body style="background-color: aliceblue">

提交和验证的表格

        <form action="home.jsp" method="get" name="login" onsubmit="return validate();">
            <fieldset style="align-self: center; height: 250px;">
                <center><legend>login</legend></center>
                <center><table style=" background-color: seashell; border:black; border-style: double; ">
                    <tr><td><label>Username</label></td>
                        <td><input type="text" name="username" required/></td>
                    <tr><td><label>Password</label></td>
                        <td><input type="password" name="password"  required/></td></tr>

中的验证码
                    <tr><td>Captcha</td><td><input type="text" readonly id="txtdraw"></td>

用户输入

                        <td><input type="text" id="txtinput" required=""/></td></tr>
                    <tr><td></td><td><input type="button" value="refresh" onclick="drawcap();" /></td></tr>
                    <tr><td><input type="submit" value="login"/></td>
                        <td><input type="reset" value="Reset"/><td></tr><br>
                    <tr><td><a href="#">New Here</a></td><td><a href="#">Forget Password</a></td></tr>
                </table></center>
            </fieldset>

        </form>
    </body>
</html>

0 个答案:

没有答案