JQuery检查必填字段

JQuery check required fields

本文关键字:字段 检查 JQuery      更新时间:2023-09-26

我在JQuery:中创建了这个函数

function CheckRequired() {
    var ret = true;
    $(".required").each( function() {
        var check = $(this).val();
        if(check == '') {
            //alert($(this).attr("id"));
            ret = false;
        }
    });
    if(!ret) {
        alert("One or more fields cannot be blank");
        return false;
    }
}

在我的表单提交按钮上,我在点击时运行这个

<input type="submit" onClick="CheckRequired();" />

如果表单中类为required的任何字段的值为空,则错误将提醒用户,表单不应提交。

警报正在显示,但表单似乎仍在提交

使用preventDefault。此方法确保不会触发事件的默认操作。

function CheckRequired(event) {
var ret = true;
$(".required").each( function() {
    var check = $(this).val();
    if(check == '') {
        //alert($(this).attr("id"));
        event.preventDefault();
    }
});
if(!ret) {
    alert("One or more fields cannot be blank");
    event.preventDefault();
}

}

为了防止表单提交,您应该将事件绑定到表单的onsubmit,并返回函数结果

<form onsubmit="return CheckRequired()" />

此外,由于您已经使用了jquery,因此在javascript:中绑定事件会方便得多

$('#form_id').submit(function(){
  //your form submit code
})

我认为您必须使用event.preventDefault();来阻止默认提交操作,如下所述:防止带有onclick事件的提交按钮提交