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复制文本框和表格的代码
Apr 01 Javascript
js阻止默认事件与js阻止事件冒泡示例分享 js阻止冒泡事件
Jan 27 Javascript
JS继承用法实例分析
Feb 05 Javascript
JavaScript检测弹出窗口是否已经关闭的方法
Mar 24 Javascript
jQuery实现仿腾讯微博滑出效果报告每日天气的方法
May 11 Javascript
jQuery头像裁剪工具jcrop用法实例(附演示与demo源码下载)
Jan 22 Javascript
使用jQuery Rotare实现微信大转盘抽奖功能
Jun 20 Javascript
最常见的左侧分类菜单栏jQuery实现代码
Nov 28 Javascript
jQuery+SpringMVC中的复选框选择与传值实例
Jan 08 jQuery
深入理解 Koa 框架中间件原理
Oct 18 Javascript
vue.js实现的全选与全不选功能示例【基于elementui】
Dec 03 Javascript
vue图片加载失败时用默认图片替换的方法
Aug 29 Javascript
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不用内置函数对数组排序的两个算法代码
2010/02/08 PHP
PHP中的gzcompress、gzdeflate、gzencode函数详解
2014/07/29 PHP
PHP实现通过URL提取根域名
2016/03/31 PHP
php面向对象的用户登录身份验证
2017/06/08 PHP
php微信分享到朋友圈、QQ、朋友、微博
2019/02/18 PHP
PHP7数组的底层实现示例
2019/08/25 PHP
基于jQuery的弹出警告对话框美化插件(警告,确认和提示)
2010/06/10 Javascript
使用indexOf等在JavaScript的数组中进行元素查找和替换
2013/09/18 Javascript
js运动应用实例解析
2015/12/28 Javascript
基于bootstrap按钮式下拉菜单组件的搜索建议插件
2017/03/25 Javascript
angularjs下ng-repeat点击元素改变样式的实现方法
2018/09/12 Javascript
用WebStorm进行Angularjs 2开发(环境篇:Windows 10,Angular-cli方式)
2018/12/05 Javascript
基于vue的验证码组件的示例代码
2019/01/22 Javascript
JS实现图片切换特效
2019/12/23 Javascript
Python中的并发处理之asyncio包使用的详解
2018/04/03 Python
Python读写及备份oracle数据库操作示例
2018/05/17 Python
对python实时得到鼠标位置的示例讲解
2018/10/14 Python
python判断文件夹内是否存在指定后缀文件的实例
2019/06/10 Python
pandas 时间格式转换的实现
2019/07/06 Python
python利用后缀表达式实现计算器功能
2021/02/22 Python
详解canvas绘制网络字体几种方法
2019/08/27 HTML / CSS
方太官方网上商城:销售方太抽油烟机、燃气灶、消毒柜等
2017/01/17 全球购物
Wiggle美国:英国骑行、跑步、游泳、铁人三项商店
2018/10/27 全球购物
Java程序员常见面试题
2015/07/16 面试题
大学团支书的自我评价分享
2013/12/14 职场文书
团委竞选演讲稿
2014/04/24 职场文书
房地产公司见习自我鉴定
2014/04/28 职场文书
建筑院校毕业生求职信
2014/06/13 职场文书
卫生院艾滋病宣传活动小结
2014/07/09 职场文书
小学中队委竞选稿
2015/11/20 职场文书
学习党章心得体会2016
2016/01/15 职场文书
导游词书写之黄山
2019/08/06 职场文书
Flask response响应的具体使用
2021/07/15 Python
redis调用二维码时的不断刷新排查分析
2022/04/01 Redis
css3 选择器
2022/05/11 HTML / CSS
zabbix如何添加监控主机和自定义监控项
2022/08/14 Servers