基于Bootstrap表单验证功能

基于Bootstrap表单验证，供大家参考，具体内容如下

GitHub地址：https://github.com/chentangchun/FormValidate

使用方式：

1.CSS样式

.valierror {
 border-color: red !important;
}

.tooltip.right .tooltip-arrow {
 border-right-color: #d15b47;
}

.tooltip-inner {
 background-color: #d15b47;
}

<form id="form">
  <input type="text" class="form-control" name="Phone" data-
  <input type="text" class="form-control" name="Name" data-
   valiType="required">
</form>

<script>
  var $form = $("#form");
  var isVali = $form.FormValidate();

</script>

以上就是本文的全部内容，希望对大家的学习有所帮助，也希望大家多多支持我们。

您可能感兴趣的文章:

  • 基于Bootstrap+jQuery.validate实现Form表单验证
  • JS组件Form表单验证神器BootstrapValidator
  • Bootstrap中的表单验证插件bootstrapValidator使用方法整理（推荐）
  • 实用又漂亮的BootstrapValidator表单验证插件
  • jquery插件bootstrapValidator表单验证详解
  • bootstrap 表单验证使用方法
  • 基于Bootstrap+jQuery.validate实现表单验证
  • 基于BootstrapValidator的Form表单验证(24)
  • Bootstrap Validator 表单验证
  • Bootstrap 表单验证formValidation 实现表单动态验证功能
赞 (0)

相关推荐

  • 基于Bootstrap+jQuery.validate实现表单验证

    基于Bootstrap+jQuery.validate实现表单验证

    这大概是一种惯例,学习前台后台最开始接触的业务都是用户注册和登录.现在社会坚持以人为本的理念,在网站开发过程同样如此.User是我们面对较多的对象,也是较核心的对象.最开始的用户注册和登陆这块,也就尤为重要. 用户注册和登录其实往往比我们想象的难.就比如表单校验,里面涵盖的内容其实挺多,就前台而言,你需要了解: 1.正则表达式的基本了解 其实正则并不难,并且在学会后能带给你极大的成就感,享受那种事半功倍的效果吧. 2.ajax异步请求 在验证用户名是否存在.用户登录时账号或者密码错误时给出相应的

  • 基于Bootstrap+jQuery.validate实现Form表单验证

    基于Bootstrap+jQuery.validate实现Form表单验证

    基于Bootstrap jQuery.validate Form表单验证实践项目结构 : github 上源码地址:https://github.com/starzou/front-end-example 1.form 表单代码[html] 复制代码 代码如下: <!DOCTYPE html>  <html>      <head>          <title>Bootstrap Form Template</title>         

  • JS组件Form表单验证神器BootstrapValidator

    JS组件Form表单验证神器BootstrapValidator

    本文为大家分享了JS组件Form表单验证神器BootstrapValidator,供大家参考,具体内容如下 1.初级用法 来看bootstrapvalidator的描述:A jQuery form validator for Bootstrap 3.从描述中我们就可以知道它至少需要jQuery.bootstrap的支持.我们首先引入需要的js组件: <script src="~/Scripts/jquery-1.10.2.js"></script> <sc

  • jquery插件bootstrapValidator表单验证详解

    jquery插件bootstrapValidator表单验证详解

    Bootstrap Validator是为Bootstrap3设计的一款表单验证jQuery插件,非常适合基于Bootstrap框架的网站. 看作者的github,这款插件已经不再更新了,而推荐使用FormValidation,不过现在还是先介绍一下BootstrapValidator的使用. 准备工作 BootstrapValidator文档地址:http://bv.doc.javake.cn/ 下载源码后,将其中的bootstrapValidator.min.css和bootstapVali

  • 基于BootstrapValidator的Form表单验证(24)

    基于BootstrapValidator的Form表单验证(24)

    Form表单进行数据验证是十分必要的,我们可以自己写JS脚本或者使用JQuery Validate 插件来实现.对于Bootstrap而言,利用BootstrapValidator来做Form表单验证是个相当不错的选择,两者完全兼容,我们也不用去关注CSS样式等美工效果. 0x01 引入BootstrapValidator 官网:BootstrapValidator,作为一个纯粹的使用者,我们可以在上面的链接处下载相关文件并引入,也可以利用CDN方式引入: <link href="//cd

  • 实用又漂亮的BootstrapValidator表单验证插件

    实用又漂亮的BootstrapValidator表单验证插件

    本文推荐一款twitter做的bootstrapValidator.js,本身bootstrap就是twitter做的,那么使用原配的validator也就更值得信赖.从百度上搜bootstrapValidator会出现很多款,但我只推荐这款: 一.一睹为快 为了简便的介绍,这里只做为空的check. BootstrapValidator官方下载地址 二.资源引用 下载完资源包后,你可以看到如下的目录. 然后把以下三个文件引入到你项目. <link type="text/css"

  • Bootstrap中的表单验证插件bootstrapValidator使用方法整理（推荐）

    Bootstrap中的表单验证插件bootstrapValidator使用方法整理（推荐）

    本文给大家介绍如何判断表单验证的实例代码,在没给大家介绍正文之前,先给大家介绍下插件. 插件介绍 先上一个图: 下载地址:https://github.com/nghuuphuoc/bootstrapvalidator 使用提示 中文化: 下载插件后,将\js\bootstrapValidator\language\zh_CN.js 引入文件,即实现中文化 提交前验证表单: 更丰富一点的表单验证例子:http://www.jq22.com/yanshi522,直接上代码: <!DOCTYPE h

  • Bootstrap Validator 表单验证

    Bootstrap Validator 表单验证

    在线演示地址:http://www.shouce.ren/study/api/s/jq--BootstrapValidator--index.html 使用方法,代码如下所示: 1.<form id="defaultForm" method="post" class="form-horizontal" action="target.php"> 2. <div class="form-group&qu

  • bootstrap 表单验证使用方法

    bootstrap 表单验证使用方法

    前言:做Web开发的我们,表单验证是再常见不过的需求了.友好的错误提示能增加用户体验.博主搜索bootstrap表单验证,搜到的结果大部分都是文中的主题:bootstrapvalidator.今天就来看看它如何使用吧. 一.源码及API地址 介绍它之前,还是给出它的源码以及API的地址吧. bootstrapvalidator源码:https://github.com/nghuuphuoc/bootstrapvalidator boostrapvalidator api:http://bv.do

  • Bootstrap 表单验证formValidation 实现表单动态验证功能

    Bootstrap 表单验证formValidation 实现表单动态验证功能

    动态添加input并动态添加新验证方式! init状态: 点击"+"后: 验证后: 知识点: 1 先去官网下载:http://formvalidation.io/ 2 导入文件,注意事项我就不多说了在远程验证那篇我已经讲过. 3 用到的关键字:addField.removeField.different 4注意一点就是官网里的例子他们的name是不一样的.我这里比较偷懒.且项目ajax的时候不是用的form表单提交,而是自己并接成json提交,所以x,y的name的名字一样. 好开始:

随机推荐