Question

这是html部分。我已经将它写在一个不同的文件和javascript到另一个.js文件中，我已经包含在html适当的地方。所有信息都通过php和mysql发送到数据库，php文件名是registration.php

<form action="registration.php" method="post" onsubmit="return validate();" name="myForm">
    <table>
        <tr>
            <td ><label><strong>First Name</strong></label></td>
            <td>
            <input name="fname" type="text" id="fname" onfocus="hideerror()" ></td>
            <td style="width: 240px">&nbsp;</td>
        </tr>
        <tr>
            <td ><label><strong>Last Name</strong></label></td>
            <td>
            <input name="lname" type="text" style="width: 177px" id="lname" onfocus="hideerror()"></td>
            <td></td>
        </tr>
        <tr>
            <td ><label><strong>Email</strong></label></td>
            <td>
            <input name="email" type="text" id="email" style="width: 178px" onfocus="hideerror()"></td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td ><label id="Label1"><strong>Confirm Email</strong></label></td>
            <td >
            <input name="cemail" type="text" id="cemail" style="width: 177px" onchange="compare_mail();" onfocus="hideerror()"></td>
            <td  ><label id="message1"></label></td>
        </tr>
        <tr>
            <td ><label id="Label1"><strong>Password</strong></label></td>
            <td style="height: 33px;">
            <input name="password" type="password" maxlength="12" style="height: 26px; width: 177px;" id="password" onfocus="hideerror()"></td>
            <td >
            </td>
        </tr>
        <tr>
            <td ><label id="Label1"><strong>Confirm Password</strong></label></td>
            <td >
            <input name="cpassword" type="password" maxlength="12" onchange="compare_password();" id="cpassword" class="auto-style15" style="width: 179px" onfocus="hideerror()"></td>
            <td ><label id="message2"></label>&nbsp;</td>
        </tr>
        <tr>
            <td ><label id="Label1"><strong>Mobile Number</strong></label></td>
            <td>
            <input name="mobile" type="text" maxlength="10" style="width: 177px" id="mobile" onfocus="hideerror()"></td>
            <td ><label id="mobile_error"></label></td>
        </tr>
        <tr>
            <td style="width: 152px">&nbsp;</td>
            <td>&nbsp;</td>
            <td style="width: 240px">&nbsp;</td>
        </tr>
        <tr>
            <td>
            <input name="register" type="submit" id="register" value="Register"></td>
            <td>&nbsp;</td>
        </tr>
        <tr>
            <td >&nbsp;</td>
            <td>&nbsp;</td>
            <td >&nbsp;</td>
        </tr>
        <tr>
            <td ><label id="massege" style="visibility:hidden">Please Fill out all the fields</label></td>
        </tr>

    </table>
    </form>

这是我的javascript验证功能

function validate(){
var x=document.forms["myForm"]["email"].value;
var x1=document.forms["myForm"]["fname"].value;
var x2=document.forms["myForm"]["lname"].value;
var x3=document.forms["myForm"]["email"].value;
var x4=document.forms["myForm"]["cemail"].value;
var x5=document.forms["myForm"]["password"].value;
var x6=document.forms["myForm"]["cpassword"].value;
var x7=document.forms["myForm"]["mobile"].value;

        if(!x1||!x2||!x3||!x4||!x5||!x6||!x7)
        {
            document.getElementById('massege').style.visibility='visible';
            return false;
        }
        else
        {
            document.getElementById('message').style.visibility='hidden';
        } 
        var atpos=x.indexOf("@");
        var dotpos=x.lastIndexOf(".");
        if(!atpos||!dotpos)
        {
            alert("Not a valid e-mail address");
            return false;

        }
         if (atpos<1 || dotpos<atpos+2 || dotpos+2>=x.length)
         {
             alert("Not a valid e-mail address");
             return false;
         }

         if(x7.length<10)
         {
            document.getElementById('mobile_error').innerHTML="Mobile number should be 10 digits";
         }
         if(x5!=x6)
         {
            document.getElementById('message2').innerHTML="Password does't match";
            return false;
         }

}

Answer 1

出于调试目的，我建议在具有调用validate（）函数的onclick事件的页面中添加<input type='button'>。这将允许您在不提交表单的情况下运行验证功能。很可能问题是验证函数中的错误并且页面正在提交，因为函数错误输出而不是按预期返回true / false。在您看到有错误之前，页面正在提交。

Answer 2

有错字：

    else
    {
        document.getElementById('message').style.visibility='hidden';
    }

它应该是“massege”。

建议：请使用firebug或chrome的开发者工具来调试javascript代码。

javascript表单验证不起作用，所有数据都发布到php

2 个答案: