原创validate信息验证控件，简单易用

jsbintask 发布于2019-08-19 18:47 / 1636人阅读

摘要：更新源码开源代码已在上，点击上面的源码查看为了方便使用，现更新版本，主要变更如下代码不用自己设置太多错误信息提示一律显示在验证框下面，以红色字体标出错误信息可以自己设置，也可以设置为空，为空时显示默认提示页面需要给添加，给添加一些属性，下面

更新validate version1.1 源码

(开源代码已在github上，点击上面的源码查看)

为了方便使用，现更新版本，主要变更如下

JS代码不用自己设置太多

错误信息提示一律显示在验证框下面，以红色字体标出

错误信息可以自己设置，也可以设置为空，为空时显示默认提示

html页面需要给form添加ID，给INPUT添加一些属性，INPUT下面添加标签label。详情如下：

使用时需要注意：

JS代码部分需要注意：

只需要new validate("formid")，传一个form的ID给我就足够了

HTML代码部分需要注意：

HTML页面相应FORM下，你要告诉我四个信息包括id="info" validate="true" validateInfo="{"type":"number"}；{"type":"email"}" error_message=""

validate=""或者"false"或者没有该属性时，其他的信息均可不用设置

设置了validate="true"时，其他三个属性必须，但可以设置为空，比如error_message=""，此时输入有误时显示的信息将是我设置的默认值

需要验证的input框下面需要添加一个标签，用于显示错误提示信息

    
        
        
    
    
    version2 validate
    随意组合，目前总共分为以下几个规则
    
        用户名：
        
        


        密码  ： 
        
        


        不能为空：
        
        


        数值不能小于10：
        
        


        数值最大不能超过100：
        
        


        数字：
        
        


        汉字：
        
        


        Email：

是不是很简单，有疑问欢迎留言
想要使用的同学，请注明版权@Ipo
转发请注明版权@Ipo
vue 新手中文社区群： 320905222

idc机房托管服务器托管 validate表单验证 validate异步验证 validate自定义验证简单日历控件html

文章版权归作者所有，未经允许请勿转载,若此文章存在违规行为，您可以联系管理员删除。

转载请注明本文地址：https://www.ucloud.cn/yun/80010.html

利用angular4和nodejs-express构建一个简单的网站（七）—用户注册之Reactiv

摘要：在提交按钮上的标记，表示当表单有不符合验证规则的输入时，按钮不能使用。取消输入按钮在控件值未发生变化时不能使用。并在构造方法中声明并初始化这三个类。下一步利用创建表单。这一节对用户注册组件进行分析。用户注册组件主要涉及angular4表单的操作。Angular提供了两种构建表单的技术：响应式表单和模板驱动表单。这两项技术都属于@angular/forms库，并且共享一组公共的表单控...

tanglijun 2019-08-05 18:02 评论0 收藏0
angular4 学习记录 -- 表单

摘要：在表单上添加的会拦截标准的表单提交事件。并为它们提供了一些共同的行为和属性，其中有些是可观察对象。用于跟踪一个单独的表单控件的值和有效性状态。组件中的顶级表单就是一个。在表单所在的中的上添加，再在指定的验证方法中调用来显示验证失败信息。 angular4 表单模板表单在app.module中导入FormsModule之后，项目中的form表单都会是一个ngForm，也就是一个模板表...

james 2019-08-21 16:45 评论0 收藏0
写一个简单易用可扩展vue表单验证插件(vue-validate-easy)

摘要：写一个表单验证插件需求目标简单易用可扩展如何简单开发者要做的写了一个表单，指定一个，指定其验证规则。调用提交表单方法，可以获取验证成功后的数据。写一个vue表单验证插件(vue-validate-easy) 需求目标：简单易用可扩展如何简单开发者要做的写了一个表单，指定一个name，指定其验证规则。调用提交表单方法，可以获取验证成功后的数据。调用重置表单方法重置表单自...

ISherry 2019-08-22 16:32 评论0 收藏0
写一个简单易用可扩展vue表单验证插件(vue-validate-easy)

摘要：写一个表单验证插件需求目标简单易用可扩展如何简单开发者要做的写了一个表单，指定一个，指定其验证规则。调用提交表单方法，可以获取验证成功后的数据。写一个vue表单验证插件(vue-validate-easy) 需求目标：简单易用可扩展如何简单开发者要做的写了一个表单，指定一个name，指定其验证规则。调用提交表单方法，可以获取验证成功后的数据。调用重置表单方法重置表单自...

keke 2019-08-02 10:13 评论0 收藏0
写一个简单易用可扩展vue表单验证插件(vue-validate-easy)

摘要：写一个表单验证插件需求目标简单易用可扩展如何简单开发者要做的写了一个表单，指定一个，指定其验证规则。调用提交表单方法，可以获取验证成功后的数据。写一个vue表单验证插件(vue-validate-easy) 需求目标：简单易用可扩展如何简单开发者要做的写了一个表单，指定一个name，指定其验证规则。调用提交表单方法，可以获取验证成功后的数据。调用重置表单方法重置表单自...

ccj659 2019-08-29 15:05 评论0 收藏0