JQuery 文本框高亮显示插件

  以前使用Mootools Js框架,文本框有个$('id').highlight()高亮方法,使其高亮显示,效果如下:

2011040119460846.jpg

JQuery 中没有这个方法,自己今天写了一个Plugin,把代码贴出来分享一下;

代码如下:

jquery-highlight.js

/*description:TextBox HighLightauthor:Allen Liu
*/
(function($) {$.fn.highlight = function(options) {var defaultOpt = {lightColor: 'yellow',   /* 高亮时的颜色 */lightTime: 1000,        /* 高亮时长 (单位:毫秒) */isFocus: true           /* 是否获取焦点 */};options = $.extend(defaultOpt, options);return this.each(function() {var sender = $(this);if (sender.attr('light') == undefined) {var _bgColor = sender.css('background-color');sender.css({ 'background-color': options.lightColor });if (options.isFocus) {sender.focus();}sender.attr('light', true); window.setTimeout(function() {sender.removeAttr('light'); sender.css({ 'background-color': _bgColor });}, options.lightTime);}});}
})(jQuery);

Html代码:

<input type="text" id="txtBox" />
<input type="password" id="txtPwd" />
<input type="button" id="btnHighLight" value="highlight" />

调用方法:

<script src="Scripts/jquery-1.5.1.min.js" type="text/javascript"></script>
<script src="Scripts/jquery-highlight.js" type="text/javascript"></script>
<script type="text/javascript">
$(document).ready(
function() {
$(
'#btnHighLight').click(function() {
$(
'#txtBox').highlight({lightColor:'red', lightTime: 1000 });
$(
'#txtPwd').highlight({ lightTime: 1000 });
});
});
</script>

效果如下:

2011040119572779.png

转载于:https://www.cnblogs.com/liulikui/archive/2011/04/01/JQuery-Plugin.html

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/news/261493.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

优秀工程师应该具备哪些素质_一名优秀工程师所需要具备的条件和素质[1]

一名优秀工程师所需要具备的条件和素质碰到一个不相熟的人。“上学还是工作&#xff1f;(我看起来还不算老嘛)”“工作了&#xff0c;一年多一点。”“做什么的&#xff1f;”“半导体行业的。”“哦&#xff0c;具体做什么呢&#xff1f;”“嗯......工程师。”工程师——这就…

链方法[C# 基础知识系列]专题三:如何用委托包装多个方法——委托链

最近研究链方法&#xff0c;稍微总结一下&#xff0c;以后继续补充&#xff1a; 弁言&#xff1a; 上一专题分析了下编译器是如何来翻译委托的&#xff0c;从中间语言的角度去看委托&#xff0c;希望可以帮助大家进一步的理解委托&#xff0c;然而之前的分析都是委托只是封装一…

51单片机lcd1602的简单实用

基础知识准备 lcd1602简介 图片来自b站斌哥单片机 需要关注的有以下几点&#xff1a; RS : 高数据低命令&#xff1b;RS 1时&#xff0c;lcd1602读写数据&#xff0c;RS0时&#xff0c;lcd1602读写命令R/W&#xff1a;高读低写&#xff1b;RW1时&#xff0c;单片机读取lcd160…

firedebug调试Jquery

不了解的同学先“点这里”看看什么是Firebug。简单来说&#xff0c;Firebug是Firefox上用来监视、编辑和调试站点的CSS、HTML、DOM和JavaScript的扩展工具。 我们先到Firebug的主页上下载最新的版本装上&#xff0c;下面开始调试&#xff1a; 1、查看、编辑HTML元素及其(转) 安…

linux下Bash编程until语句及格式化硬盘分区等编写脚本(十)

linux下Bash编程until语句及格式化硬盘分区等编写脚本(十)1.循环语句结构总结1.1.while语句当条件满足时&#xff0c;进入循环语句while 条件; do语句done1.2.until语句当条件不满足时&#xff0c;进入循环语句until 条件; do语句done1.3.for 变量 in 列表; do 循环体done1.4.f…

halcon区域腐蚀膨胀算子_Halcon算子

Halcon部分算子功能&#xff1a;*读取一张图像read_image(Image,C:/Users/Desktop/无标题.png)*画一个矩形生成区域draw_rectangle1(3600, Row1, Column1, Row2, Column2)*获得矩形区域gen_rectangle1(Rectangle, Row1, Column1, Row2, Column2)*区域内最大、最小、最大-最小灰…

51单片机数字钟的实现

作业 用51单片机完成一个数字钟的计时及校时功能。 1、设置8个数码管的显示缓冲区为DISPBUFF[8],并初始化为02,02,-,04,08,-,03,06. 2、定时器0每隔5ms刷新一次数码管显示缓冲区&#xff0c;并显示时间(中断来做&#xff09; 3、定时器1负责精确定时&#xff0c;计时1s,每隔…

Google Map API 学习三

转载于:https://www.cnblogs.com/MyFlora/p/3154066.html

委托声明----委托实例化-----委托调用

定义和使用委托分三个步骤&#xff1a; 1、委托声明。2、委托实例化。3、委托调用。 一、定义委托定义委托的语法如下&#xff1a; <访问修饰符> delegate 返回类型 委托名(); 定义委托和定义方法很相似&#xff0c;委托没有具体的实现体&#xff0c;由关键字delegate声明…

慎用SELECT INTO复制表

很多时候我们习惯于用SELECTINTO 复制一个表或表结构&#xff0c;因为它方便&#xff0c;快捷&#xff0c;而且在某些情况下效率比INSERT INTO 效率要高一些。但是要注意&#xff1a; SELECT INTO 复制表或表结构的时候&#xff0c;只是得到了一个“外壳”&#xff0c;就像克隆…

mysql sql语句使用技巧

mysql更新数据限制limitmysql更新时&#xff0c;要更新记录中某个区间的数据&#xff0c;只能用WHERE条件来限制了&#xff0c;用LIMIT只能限制更新多少条&#xff01;测试如下&#xff1a;UPDATE products SET goods_number goods_number10 ORDER BY goods_id DESC LIMIT 5,1…

wingdows安装psutil_psutil模块安装指南(win与linux)

1、windows下psutil模块安装&#xff1a;https://pypi.python.org/packages/3.4/p/psutil/下载符合版本的软件包下载&#xff0c;然后安装即可。2、ubuntu下载psutil模块的tar包安装复制代码 代码示例:wget https://pypi.python.org/packages/source/p/psutil/psutil-2.1.3.tar…

信号的采样与插值重建(包含matlab)

实验任务 双频信号的采样和插值重建&#xff1a;对双频信号进行采样&#xff08;符合奈奎斯特低通采样定理&#xff09;&#xff0c;绘制波形和频谱&#xff1b;编制sinc函数插值函数&#xff0c;对采样进行恢复&#xff0c;绘制波形。 实验原理 matlab代码 clear all; clos…

dc概论之IO约束

版权声明&#xff1a;转载时请以超链接形式标明文章原始出处和作者信息及本声明http://bb2hh.blogbus.com/logs/39654476.html 注明&#xff1a;如需转载&#xff0c;请注明作者出处&#xff0c;谢谢&#xff5e;&#xff0c;Author&#xff1a;pythonlong以下根据资料和个人体…

对寄存器ESP和EBP的一些理解

PS&#xff1a;EBP是当前函数的存取指针。即存储或者读取数时的指针基地址&#xff1b;ESP就是当前函数的栈顶指针。每一次发生函数的调用&#xff08;主函数调用子函数&#xff09;时&#xff0c;在被调用函数初始时&#xff0c;都会把当前函数&#xff08;主函数&#xff09;…

配置FCKeditor_2.6.3+fckeditor-java-2.4

下载 http://www.fckeditor.net/download FCKeditor.Javahttp://sourceforge.net/project/showfiles.php?group_id75348&package_id129511 -1- copy fckeditor文件夹到项目的webRoot目录下 -2- 添加Jar包 slf4j-simple-1.5.0.jar slf4j-api-1.5.0.jar java-core-2.4-beta-…

普通调幅(AM)与抑制载波双边带调幅(DSB)matlab编程实现

实验任务 实现单频信号的AM、DSB调制&#xff0c;绘制调制前后的波形和频谱 实验原理 matlab代码 AM调制 clear all; ts 0.0025; %信号抽样时间间隔 fs 1/ts; %抽样频率 t 0:ts:10-ts; %时间向量 df fs/length(t); %fft的频率分辨率 msg2 cos(2*pi*2*t); Pn fft(msg2…

electron 读取文件夹内容_如何使用Electron Framework选择,读取,保存,删除或创建文件...

本文概述为了处理文件(CRUD)的生命周期, 我们将使用对话框和文件系统组件。对话框模块提供了用于显示本机系统对话框(例如打开文件或警报)的API, 因此Web应用程序可以提供与本机应用程序和Node.js文件系统相同的用户体验。加载所需的依赖项我们需要加载以下依赖项, 以执行我们要…

MySQL中MySQL X.X Command Line Client一闪而过的问题

问题介绍&#xff1a;我安装完MySQL(我安装的是5.5)后&#xff0c;使用MySQL 5.5 Command Line Client&#xff0c;每次点击&#xff0c;总是一闪而过。解决方法如下&#xff1a;首先进入cmd 切入MySQL的安装目录&#xff0c;然后切入 bin 目录 &#xff0c;输入mysqld-nt --sk…

4pam调制与解调(matlab实现)

实验原理 这是一种使用脉冲幅度调制技术的线路编码。PAM4信号有四个电压电平&#xff0c;每个幅度电平分别对应逻辑比特00、01、10和11。换言之&#xff0c;PAM4编码的每个符号由2个比特组成&#xff0c;它们对应一个电压电平&#xff0c;即幅度。 00对应-3,01对应-1,10对应1,…