如何在javascript中进行表单验证时停止执行

时间:2013-03-22 06:55:28

标签: javascript jquery json cordova

我在下面的编码中有两个问题。

首先,现在我想在提交前进行验证。如果从验证功能中检测到某些错误,我该如何停止提交?是否只是在每个错误消息后返回false?然而,它似乎仍然检查所有字段而不是在收到一个错误后停止。

其次,我想通过php插入数据。每次,它都可以成功地将数据添加到数据库中,但是,它总是警告“错误:错误”。我不知道错误来自哪里......

$(document).ready(function()
{
    $('#test').click(function(){
    validation();   
    });

    function validation(){  
    var loginID=$("#loginID").val();

    if (loginID=="" || loginID==null)
    {
        $('#errorID').empty();
        $('#errorID').append(
        '<h6>' + "The Login Name cannot be empty" + '</h6>');
        $("#errorID").show();

    }
    else
    {

    }

    // check pw
    $("#errorPW").hide();
    if ($("#loginPW").val()=="" || $("#loginPW").val()==null)
    {
        $('#errorPW').empty();
        $('#errorPW').append(
        '<h6>' + "The Login Password cannot be empty" + '</h6>');
        $("#errorPW").show();

    }
    else
    {

    }

    //return false;

    } // end of #validation


    $('form').submit(function(){

        validation();
        $.ajax({
            type: 'POST',
            data: 
            {
                    loginID:        $("#loginID").val(),
                    // some data here

            },
            url: 'http://mydomain.com/reg.php',
            success: function(data){
                alert('successfully.');         
            },
            error: function(jqXHR, textStatus){
                alert("Error: " + textStatus);
            }
        });

        return false;
    });
});

5 个答案:

答案 0 :(得分:1)

您可以使用return false。它将停止执行

<form onSubmit="validatdeForm();"></form>


function validatdeForm()
{
  //here return true if validation passed otherwise return false
}

 if (loginID=="" || loginID==null)
    {
        $('#errorID').empty();
        $('#errorID').append(
        '<h6>' + "The Login Name cannot be empty" + '</h6>');
        $("#errorID").show();
        return false;

    }

    if ($("#loginPW").val()=="" || $("#loginPW").val()==null)
{
    $('#errorPW').empty();
    $('#errorPW').append(
    '<h6>' + "The Login Password cannot be empty" + '</h6>');
    $("#errorPW").show();
    return false;

}

答案 1 :(得分:1)

它应该是下面的东西。 返回false 在出现错误时停止执行脚本。

function validation(){  
    var loginID=$("#loginID").val();

    if (loginID=="" || loginID==null)
    {
        $('#errorID').empty();
        $('#errorID').append(
        '<h6>' + "The Login Name cannot be empty" + '</h6>');
        $("#errorID").show();
        return false;

    }
    else
    {
       return true; 
    }

    // check pw
    $("#errorPW").hide();
    if ($("#loginPW").val()=="" || $("#loginPW").val()==null)
    {
        $('#errorPW').empty();
        $('#errorPW').append(
        '<h6>' + "The Login Password cannot be empty" + '</h6>');
        $("#errorPW").show();
        return false;

    }
    else
    {
        return true;
    }

    return true;

    } // end of #validation

答案 2 :(得分:1)

设计您的validation功能,如下所示

function validation()
{  
    var isValid = true;

    if(field validation fail)
    {
        isValid = false;
    }
    else if(field validation fail)
    {
        isValid = false;
    }

    return isValid;
}
只要code失败,<{1}}背后的基本理念就是returning false

答案 3 :(得分:1)

要进行正确的表单验证,我建议您以更有条理的方式进行。它更容易调试。试试这个:

var validation = {
  // Checking your login ID
  'loginID' : function() {
    // Login ID validation code here...
    // If a validation fails set validation.errors = true;
    // Additionally you can have a validation.idError that contains
    // some error message for an id error.
  },

  // Checking your password
  'loginPW' : function() {
    // Password validation code here...
    // If a validation fails set validation.errors = true;
    // As with id, you can have a validation.pwError that contains
    // some error message for a password error.
  },

  'sendRequest' : function () {
    if(!validation.errors) {
      // Code for whatever you want to do at form submit.
    }
  }
};

$('#test').click(function(){
  validation.errors = false;
  validation.loginID();
  validation.loginPW();
  validation.sendRequest();
  return false;
});

答案 4 :(得分:0)

function validateimage() { if($("#photo").val() !== '' ) {

    var extensions = new Array("jpg","jpeg","gif","png","bmp");
    var image_file = document.form_useradd.photo.value;
    var image_length = document.form_useradd.photo.value.length;
    var pos = image_file.lastIndexOf('.') + 1;
    var ext = image_file.substring(pos, image_length);
    var final_ext = ext.toLowerCase();
    for (i = 0; i < extensions.length; i++)
    {
    if(extensions[i] == final_ext)
    {
    return true;
    }
    }
    alert(" Upload an image file with one of the following extensions: "+ extensions.join(', ') +".");

    //$("#error-innertxt_photo").show().fadeOut(5000);
    //$("#error-innertxt_photo").html('Enter valid file type');
    //$("#photo").focus();
    return false;

}
相关问题