zoukankan      html  css  js  c++  java
  • jQuery Validation让验证变得如此easy(二)

    上一个样例我们是统一引用jquery.validate.js这样全部必填字段的提示信息都将是This field is required.

    如今要改成动态提示,比方姓名假设为空则提示姓名不能为空,密码假设为空则提示密码不能为空。


    这次我们将校验规则写在代码里

    首先还是先引入文件

    <script src="js/jquery-1.8.0.min.js" type="text/javascript"></script>
    <script src="js/jquery.validate.js" type="text/javascript"></script>

    接下来,声明以下的HTML片段

    <form action="" id="jvForm">
    	姓名:<input type="text" name="username" id="username" /></br>
    	密码:<input type="password" name="password" id="password" /></br>
    	<input type="submit" value="提交" />
    </form>
    和之前的相比没有了class="required"


    最后 校验规则例如以下:

    $(function() {
        $("#jvForm").validate({
            rules: {
                username: {
                    required: true
                },
                password: {
                    required: true
                }
            },
            messages: {
                username: {
                    required: "姓名不能为空!"
                },
                password: {
                    required: "密码不能为空!"
                }
            }
        });
    })

    执行效果



  • 相关阅读:
    React实现双数据绑定
    浏览器兼容
    关于postman
    前端常用插件、工具类库
    媒体查询总结
    Vue开发中可能会使用到的所有插件
    Vue+iView通过a标签导出文件
    类的内置方法
    单元测试
    面向对象的三大特性
  • 原文地址:https://www.cnblogs.com/tlnshuju/p/7354616.html
Copyright © 2011-2022 走看看