javascript - 使用 jquery 和 javascript 代码进行表单验证

Question

我正在尝试验证我的表单是否为空字段，但我不确定我应该使用什么代码，有人可以指导我吗？我尝试了以下代码，但它不起作用

$("validate").submit(function(event){
    $(".offset2").each(function(index) {
       if ($(this).val() == 0) {
           $("#error").css({"display": "inline"}).text("Some of the fields are empty");
           event.preventDefault();
       }
    });
});

Answer 1

只需使用插件....随着您的成长，灵活性更高。

这是谷歌 1 分钟后免费的一个。

http://jqueryvalidation.org/

Answer 2

检查这个

if ($(this).val().length == 0) { // .length is missing in your code
    // Show Error
}
// Or
if (!$(this).val()) { // Empty string is consider as false type in JavaScript 
    // Show Error
}

Answer 3

@CodeMonkeyForHire 建议使用插件。

最常用的是jQueryValidation。它会让你像这样编写标记：

<input id="cname" name="name" minlength="2" type="text" required/>

然后在您的提交按钮上，您只需一次调用即可验证表单中的所有元素：

$("#commentForm").validate();

您可以尝试许多其他框架，例如ParselyJs或ValidateJs 。

PS 谷歌是你的朋友，总是寻找插件（可能其他人遇到了同样的问题）

Answer 4

你不是在“验证”之前错过了一个“#”吗？

   $("#validate").submit(function(event){
        $(".offset2").each(function(index) {
           if ($(this).val() == 0) {
               $("#error").css({"display": "inline"}).text("Some of the fields are empty");
               event.preventDefault();
           }
        });
    }

);

http://api.jquery.com/submit/

Answer 5

尝试这个，

$(function(){
    $("validate").submit(function(event){
        event.preventDefault();
        var status=true;
        $(".offset2").each(function(index) {
           if (!$(this).val()) {
               $("#error").css({"display": "inline"}).text("Some of the fields are empty");
               status=false;
           }
        });
        return status;
    });
});

Answer 6

我肯定会推荐 H5Validate http://ericleads.com/h5validate/

它允许您使用正确的 HTML5 属性进行验证。