提交表单时jQuery问题

时间:2015-03-24 06:49:33

标签: jquery forms

我遇到的问题是当我点击表单中的提交按钮时。这不是验证,而是直接发布到PHP脚本,但当我点击文本框时,它正在验证完美。我需要在提交前验证表格。

Javascript代码

<script type="text/javascript">

    //Begin of Ready document
    $(document).ready(function () {

            $("#fname").blur(function(){

                if($("#fname").val() == "" ){

                    $("#fname").focus();
                    $("#fvalid").html("First Name Cannot be Blank");
                    return false;

                }else{
                    $("#fvalid").html("");
                    return true;
                }

            });

            $("#lname").blur(function(){

                if($("#lname").val() == "" ){

                    $("#lname").focus();
                    $("#lvalid").html("Last Name Cannot be Blank");
                    return false;

                }else{
                    $("#lvalid").html("");
                    return true;
                }

            });
</script>

HTML代码

<table class="content" cellspacing="0" cellpadding="0" align="center" style="padding-top:20px;">
    <tr>
        <td class="contentfont">First Name<span class="sup">*</span></td>
        <td class="contentfont">:</td>
        <td><input type="textbox" name="fname" class="textbox" id="fname"></td>
    </tr>
    <tr>
        <td colspan="3"><span id="fvalid" class="failed"></span></td>
    </tr>
    <tr>
        <td class="contentfont">Last Name<span class="sup">*</span></td>
        <td class="contentfont">:</td>
        <td><input type="textbox" class="textbox" name="lname" id="lname"></td>
    </tr>
    <tr>
        <td colspan="3"><span id="lvalid" class="failed"></span></td>
    </tr>
    <tr>
        <td align="center" colspan="3"><input type="submit" name="submit" class="register" value="Register Now" id="submit"></td>
    </tr>

    <tr>
        <td align="center" colspan="3"><input type="submit" name="submit" class="register" value="Register Now" id="submit"></td>
    </tr>

</table>

有人可以帮忙解决这个问题吗?

1 个答案:

答案 0 :(得分:0)

您正在blur进行验证。这意味着,当您离开文本框时,此事件将触发。但是您没有编写任何代码来验证提交事件中的表单。你应该这样做:

$("#formID").submit(function(){
    var valid = true;
    if($("#fname").val() == "" ){
      $("#fname").focus();
      $("#fvalid").html("First Name Cannot be Blank");
      valid = false;
    }

    if($("#lname").val() == "" ){
         $("#lname").focus();
         $("#lvalid").html("Last Name Cannot be Blank");
         valid = false;
     }

  return valid;

});