在线演示

本地下载

(代码太多请查看原文)

加班,加班加班,我爱加班··· 我已经疯了,哦也。

这次发一个刚接触boot的时候用boot做的表单验证,我们扩展一下tooltip的插件,让他可以换颜色。

其实挺简单的,主要是考究代码阅读的能力。

boot的代码写的很简单,能省略“;”的地方就省略掉了,而且他的闭包也很有意思

  1. +function($){

  2. }(jQuery);

这种写法等同于

  1. (function($){

  2. })(jQuery);

少些一个符号,比较节俭。

他的对外接口写的就比较正常了:

。。。。

return就好像一个构造函数,.each 让方法对到每个dom上而不是dom数组。这里new一个Tooltip方法,所有的操作多在这个Tooltip中,应用prototype,把方法细分到细分,尽量原子化方法,做一个面向对象的js方法。

大体的架构就是这个样子的了。我们需要做的就是加一个参数,然后再应用到这个参数。

首先我们先给它的默认参数里面加一个:

。。。。

然后在我们调取它的方法时候,也同样加进去这个属性:

。。。。

一起:

。。。。

这个方法在tooltip的init方法里会被调用 :

。。。。

它内部对内容和箭头有特定的命名:$tip 和 $arrow;找了半天,觉得在插入内容的时候,我们来改颜色最好,所以有了下面的代码:

。。。。

这样tooltip的扩展就做好啦。

之后我们就可以用他来做一个简单的表单验证啦。

效果见代码演示。

(代码太多请查看原文)

阅读全文:扩展一个boot的插件—tooltip&做一个基于boot的表达验证

扩展一个boot的插件—tooltip&做一个基于boot的表达验证的更多相关文章

  1. 使用jq把js代码封装一个自己的插件

    为什么要把js功能封装成插件呢?我觉得有以下几点吧 1.最基本的原因就是便于代码复用. 2.便于维护和管理. 3.提升自身的能力. 4.避免各个相同功能组件的干扰,以及一些作用域会相互影响的问题. j ...

  2. 做一个自动修改本机IP和mac的bat文件

    原文:做一个自动修改本机IP和mac的bat文件 1.ip bat修改理论探讨 前两天我突然萌生了一个念头:能不能做一个小程序来实现自动配置或修改IP和mac,达到一键搞定的目的,这样尤其适合那些带着 ...

  3. 如何做一个网站 (C# + MVC Web+ easyUI )

    如何做一个网站 小编想做一个网站,采用技术为:C# + MVC Web+ easyUI 小编经过几天的学习,以及指了几位大神指导,初见效果.建立网站的思路:先列举需要用到了几个知识点,然后逐一攻克,然 ...

  4. 先做一个用来测试的chrome浏览器插件

    如何制作chrome插件 在项目汇报中,有同学提到了想要了解如何制作插件,特写该篇博客供大家查阅~ 一个简单的插件需要manifest.json.popup.html.popup.js.content ...

  5. 强哥的分享--如何使用Spring Boot做一个邮件系统

    http://springboot.fun/ actuator是单机.集群环境下要使用Spring Boot Admin将各个单机的actuator集成越来 mvn clean package -Dm ...

  6. 使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能。并且在界面上有radio 的选择内容也要上传

    使用 jquery 的 上传文件插件 uploadify 3.1 配合 java 来做一个简单的文件上次功能.并且在界面上有radio 的选择内容也要上传 uploadify 插件的 下载和文档地址  ...

  7. 做了一个sublime text插件

    做了一个sublime text插件,可以方便地查看C++/python的调用图.插件的演示视频在这里: http://list.youku.com/albumlist/show?id=2820226 ...

  8. 利用jQuery来扩展一个瀑布流插件

      简单了解jQuery.fn.extend() jQuery.fn.extend()函数用于为jQuery扩展一个或多个实例属性和方法(主要用于扩展方法). (截图来自jQuery文档) 为了更清晰 ...

  9. [转]jsPlumb插件做一个模仿viso的可拖拉流程图

    原贴:https://www.cnblogs.com/sggx/p/3836432.html 前言 这是我第一次写博客,心情还是有点小小的激动!这次主要分享的是用jsPlumb,做一个可以给用户自定义 ...

随机推荐

  1. Task Parallel Library01,基本用法

    我们知道,每个应用程序就是一个进程,一个进程有多个线程.Task Parallel Library为我们的异步编程.多线程编程提供了强有力的支持,它允许一个主线程运行的同时,另外的一些线程或Task也 ...

  2. 更好使用jQuery的8个小技巧

    更好地使用jQuery,这里总结了8个小技巧. 1.DOM遍历是昂贵的,将变量缓存起来. //不推荐var h = $('#ele').height();$('#ele').css('height', ...

  3. fdLocalSql使用方法

    fdLocalSql使用方法 fdLocalSql可以对fdMemTable内存表进行SQL查询(可以对多个fdMemTable内存表进行联表查询哦),fdLocalSql使用SQLITE引擎,而FI ...

  4. 【ELK】【docker】【elasticsearch】2.使用elasticSearch+kibana+logstash+ik分词器+pinyin分词器+繁简体转化分词器 6.5.4 启动 ELK+logstash概念描述

    官网地址:https://www.elastic.co/guide/en/elasticsearch/reference/current/docker.html#docker-cli-run-prod ...

  5. Fidder发送Get、POST请求

      Composer:   1.Get请求 a) 请求头加上: Content-Type: application/json; charset=utf-8   b) url:http://localh ...

  6. 看书小记6(《C专家编程》)

    typedef不常见但值得一提的用途: 1. 用typedef来定义与平台无关的类型. 比方定义一个叫 REAL 的浮点类型.在目标平台一上.让它表示最高精度的类型为: typedef long do ...

  7. mariadb 重置密码

    1. sudo身份打开 /etc/mysql/my.cnf 在[mysqld]节点下增加如下代码: skip-grant-tables #忽略密码授权 2. 杀掉mysql进程,重启mariadb,这 ...

  8. 通过图形化工具来画shape

    前两天一个哥们分享了十分好用的图形化工具,这样我们就能实时的看到自己用代码写出来的shape是怎么样的了,更牛的是它可以让我们自己去设定值,最后生成代码,这样我们为什么要去自己写shape呢?如果一个 ...

  9. SQL中树形分层数据的查询优化

    在数据查询中,从2008开始SQL Server提供了一个新的数据类型hierarchyid,专门用来操作层次型数据结构. hierarchyid  类型对层次结构树中有关单个节点的信息进行逻辑编码的 ...

  10. 在 JDK 9 中更简洁使用 try-with-resources 语句

    本文详细介绍了自 JDK 7 引入的 try-with-resources 语句的原理和用法,以及介绍了 JDK 9 对 try-with-resources 的改进,使得用户可以更加方便.简洁的使用 ...