jquery.validata的验证方式

最新推荐文章于 2022-04-01 16:04:03 发布

SnailKingF

最新推荐文章于 2022-04-01 16:04:03 发布

阅读量613

点赞数

本文链接：https://blog.csdn.net/SnailKingF/article/details/79353428

版权

本文介绍了jQuery Validate插件的三种验证方式：1) 在控件内直接写验证；2) 将校验规则置于JS代码中并触发验证；3) 使用Class进行验证。特别提醒，自定义验证通常放在jQuery.validate.custom.js文件中单独调用。

摘要由CSDN通过智能技术生成

一、将验证写在控件内

    <form class="cxform" id="commentForm" method="get" action="">
        <fieldset>
            <legend>请输入您的名字，邮箱，Url,备注</legend>
        </fieldset>
        <p>
            <label for="cname">Name(必需，最小的两个字母)</label>
            <input id="cname" name="name" minlength="2" type="text" required/>
        </p>
        <p>
            <label for="cemail">E-Mail(必需)</label>
            <input id="cemail" type="email" required />
        </p>
        <p>
            <label for="curl">URL(可选)</label>
            <input id="curl" type="url" name="url" />
        </p>
        <p>
            <label for="ccomment">必备(必需)</label>
            <textarea id="ccomment" name="comment" required></textarea>
        </p>
        <p>
            <input class="submit" type="submit" value="Submit">
        </p>
    </form>

二、将校验规则写到js代码中

            $("#AddPlan").validate(
            {
                rules: {
                    Title:"required",
                    Content: "required",
                    start_date: "required",
                    responsible:"required"
                },
                messages: {
                    Title: "请输入标题",
                    Content: "请输入内容",
                    start_date: "请选择完成时间",
                    responsible:"请选择负责人"
                },
                showErrors: function (errorMap, errorList) {
                    var msg = "";
                    $.each(errorList, function (i, v) {
                        msg += (v.message + "\r\n");
                    });
                    if (msg != "") {
                        layer.open({
                            content: msg
                             , skin: 'msg'
                             , time: 2 //2秒后自动关闭
                        })
                    }
                },
                onfocusout: false,
                onkeyup: false,
            })

触发验证并判断

var flag = $("#AddPlan").valid();
if (!flag) {
	$("#btn_sub").removeAttr('disabled').val("提交");
	return
}

三、添加Class形式的校验

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"

最低0.47元/天解锁文章

SnailKingF

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
jquery.validata的验证方式

一、将验证写在控件内 &lt;form class="cxform" id="commentForm" method="get" action=""&gt; &lt;fieldset&gt; &lt;legend&gt;请输入您的名字，邮箱，Url,备注&lt;/legend&gt; &lt;/f
复制链接

扫一扫