jquery validate初上手

作者:操作系统

jquery validate初上手

前言:jquery validate初上手,这个标题不知道是否合适,因为之前已经在dwz中用过validate。但是,毕竟是经过zhanghuihua同学封装过的,对于bootstrap的表单验证,还需要初上手,当然这一篇是初阶的教程,先来看看怎么用。

材料准备

现在jquery的插件官网上下载下来的没有中文的翻译包,所以我重新根据项目需要做了一个。
下载对应的jquery validate

开始搞

1.写一个form表单

当然这个代码不完整,你只需要注意这些内容:

onsubmit=”return validateCallback(this);” class=”form-control required”

注意这两处的写法。

2.增加css

span.error {
    background: #f00 none repeat scroll 0 0;
    color: #fff;
    display: block;
    height: 21px;
    left: 318px;
    line-height: 21px;
    overflow: hidden;
    padding: 0 3px;
    top: 5px;
}

input.error, textarea.error {
    border-color: #f80c11 #fb7e81 #fb7e81 #f80c11;
}

input.focus, textarea.focus {
    background-color: #f8fafc;
    border-color: #64aabc #a9d7e3 #a9d7e3 #64aabc;
}

3.当然别忘记引入包

<script type=text/javascript src=${ctx}/components/yunm/yunm.validate.method.js></script>
<script type=text/javascript src=${ctx}/components/yunm/yunm.validate.zh.js></script>
<script type=text/javascript src=${ctx}/components/validate/jquery.validate.js></script>

4.写入一个这样的方法

function validateCallback(form, callback, confirmMsg) {
    var $form = $(form);

    if (!$form.valid()) {
        return false;
    }
    }

效果

图片 1

 

validate初上手 前言 :jquery validate初上手,这个标题不知道是否合适,因为之前已经在dwz中用过validate。但是,毕竟是经过zhanghuihua同学...

本文由金冠53777-金冠娱乐53777-Welcome发布,转载请注明来源

关键词: