js实现基于正则表达式的轻量提示插件


Posted in Javascript onAugust 29, 2015

本文实例讲述了基于正则表达式的轻量提示插件,分享给大家供大家参考。具体如下:
这是一款javascript实现基于正则表达式的轻量提示插件,本插件是基于正则表达式进行文本框检测的,通用性十分强,大家可以在实例中进行使用。
运行效果图:               -------------------查看效果-------------------

js实现基于正则表达式的轻量提示插件

小提示:浏览器中如果不能正常运行,可以尝试切换浏览模式。
关键代码:

$(document).ready(function () {
      $("#message").inputNotes(
       {
         sexwarning: {
           pattern: /(^|\s)色情(\s|$)/ig,
           type: 'warning',
           text: 'Do not type "sex"!'
         },
         numbersnote: {
           pattern: /[0-9]/,
           type: 'note',
           text: 'Do not type numbers!'
         }
       }
      );
    });

为大家分享的代码如下

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
  <title>基于正则表达式的轻量提示插件</title>
  <script src="js/jquery-1.7.1.js"></script>
  <script src="js/jquery.inputnotes-0.6.js"></script>
</head>
<style>
  div.inputnotes div.warning
  {
    color: #fff;
    background: #f03;
  }
</style>
<body>
  若输入“不合法”字眼的文字将提示<br />
  <textarea  id="message" cols="60" rows="4" ></textarea>
  <a href="javascript:void(null);" onclick="alert( $('#message').hasInputNotes() )"><br />文本框是否含不合法的字符</a>
  <script>
    $(document).ready(function () {
      $("#message").inputNotes(
       {
         sexwarning: {
           pattern: /(^|\s)不合法(\s|$)/ig,
           type: 'warning',
           text: '不能出现 "不合法"相关的字符!'
         },
         numbersnote: {
           pattern: /[0-9]/,
           type: 'note',
           text: 'Do not type numbers!'
         }
       }
      );
    });

  </script>
</body>
</html>

以上就是为大家分享的基于正则表达式的轻量提示插件,希望大家可以喜欢,并应用到实践中。

Javascript 相关文章推荐
JS 用6N±1法求素数 实例教程
Oct 20 Javascript
javascript parseInt与Number函数的区别
Jan 21 Javascript
JQuery扩展插件Validate—6 radio、checkbox、select的验证
Sep 05 Javascript
showModalDialog模态对话框的使用详解以及浏览器兼容
Jan 11 Javascript
js加入收藏夹代码(兼容ie/ff/op)
May 16 Javascript
JS创建对象几种不同方法详解
Mar 01 Javascript
jQuery实现导航高亮的方法【附demo源码下载】
Nov 09 Javascript
jQuery 获取select选中值及清除选中状态
Dec 13 Javascript
通过sails和阿里大于实现短信验证
Jan 04 Javascript
基于JavaScript实现全选、不选和反选效果
Feb 15 Javascript
javascript 实现文本使用省略号替代(超出固定高度的情况)
Feb 21 Javascript
JS实现点击生成UUID的方法完整实例【基于jQuery】
Jun 12 jQuery
js精美的幻灯片画集特效代码分享
Aug 29 #Javascript
jQuery实现淡入淡出二级下拉导航菜单的方法
Aug 28 #Javascript
jquery实现清新实用的网页菜单效果
Aug 28 #Javascript
jquery左右全屏大尺寸多图滑动效果代码分享
Aug 28 #Javascript
jQuery实现多级下拉菜单jDropMenu的方法
Aug 28 #Javascript
js实现简单折叠、展开菜单的方法
Aug 28 #Javascript
web前端开发JQuery常用实例代码片段(50个)
Aug 28 #Javascript
You might like
PHP  Yii清理缓存的实现方法
2016/11/10 PHP
PHP实现二叉树深度优先遍历(前序、中序、后序)和广度优先遍历(层次)实例详解
2018/04/20 PHP
thinkPHP框架整合tcpdf插件操作示例
2018/08/07 PHP
safari下载文件自动加了html后缀问题
2018/11/09 PHP
jquery动态分页效果堪比时光网
2014/09/25 Javascript
JS实现从表格中动态删除指定行的方法
2015/03/31 Javascript
JS的框架Polymer中的dom-if和is属性使用说明
2015/07/29 Javascript
js和jquery实现监听键盘事件示例代码
2020/06/24 Javascript
js removeChild 方法深入理解
2016/08/16 Javascript
ES6新特性之数组、Math和扩展操作符用法示例
2017/04/01 Javascript
微信页面弹出键盘后iframe内容变空白的解决方案
2017/09/20 Javascript
浅谈vux之x-input使用以及源码解读
2018/11/04 Javascript
JS实现鼠标拖拽盒子移动及右键点击盒子消失效果示例
2019/01/29 Javascript
简单了解微信小程序的目录结构
2019/07/01 Javascript
python解析中国天气网的天气数据
2014/03/21 Python
Python做文本按行去重的实现方法
2016/10/19 Python
Python网络编程 Python套接字编程
2017/09/13 Python
python使用筛选法计算小于给定数字的所有素数
2018/03/19 Python
Python网络编程之TCP套接字简单用法示例
2018/04/09 Python
详解python调用cmd命令三种方法
2019/07/08 Python
Python matplotlib画曲线例题解析
2020/02/07 Python
Python接口测试get请求过程详解
2020/02/28 Python
广州某公司软件工程师面试题
2014/12/22 面试题
七匹狼男装广告词
2014/03/21 职场文书
警示教育活动总结
2014/05/05 职场文书
求职信怎么写范文
2014/05/26 职场文书
普通党员整改措施
2014/10/24 职场文书
2014年语文教学工作总结
2014/12/17 职场文书
优秀大学生事迹材料
2014/12/24 职场文书
2015年预备党员自我评价
2015/03/04 职场文书
2015年世界无车日活动总结
2015/03/23 职场文书
少先队工作总结2015
2015/05/13 职场文书
2015年教务处干事工作总结
2015/07/22 职场文书
小学运动会开幕词
2016/03/04 职场文书
2016年“12.4”法制宣传日活动总结
2016/04/01 职场文书
在Windows下安装配置CPU版的PyTorch的方法
2021/04/02 Python