JQuery 文本框高亮显示插件

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

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代码：

调用方法：

效果如下：

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

JQuery 文本框高亮显示插件相关推荐

jQuery弹框 remodal 插件
jQuery弹框 remodal 插件的使用官方文档点击这里查看详情其他相关推荐插件插件描述:Remodal 是一个扁平化,响应式,轻量,快速,容易定制的模态窗口插件.使用声明式状态符号和哈希( ...
jQuery文本框(input textare)事件绑定方法教程
jquery 的事件绑定已经用on替换了原来的bind,接下来为大家分享下bind的使用方法及input textare事件.目前1.7以上,jquery?的事件绑定已经用on替换了原来的bind,接 ...
jquery文本框改变事件
可参考如下几个事件: <!doctype html> <html lang="en"> <head><meta charset=" ...
java 文本控件值变化,jquery文本框内容改变事件
随机推荐 &;04下简易安装 java安装首先需要上的网站下载在lib目录下建立一个jvm文件夹然后解压文件到这个文件夹- 编译安装服务端有一种方式是:下载-server-generic-u ...
jquery文本框禁止删除值
禁止删除键只能输入框用 <input type="text" class="form-control" id="bjzhijiname&quo ...
如何使用jQuery获取文本框值
要获取文本框值,可以使用jQuery val()函数. 例如, $('input:textbox').val()-获取文本框值. $('input:textbox').val("新短信&qu ...
基于bootstrap的富文本框——wangEditor【欢迎增加开发】
先来一张效果图: 01. 引言老早就開始研究富文本框的东西,在写完<深入理解javascript原型与闭包>之后,就想着要去做一个富文本框的插件的样例.
js文本框设置必填项_Jquery文本框小例（必填框）
//当光标离开文本框的时候如果文本框为空,则将文本框边框色设置为红色,如果不为空则为白色.提示:焦点进入控件的事件是focus或者mousedown,焦点离开控件的事件是blur. $(functio ...
基于bootstrap的富文本框——wangEditor【欢迎加入开发】
先来一张效果图: 01. 引言老早就开始研究富文本框的东西,在写完<深入理解javascript原型与闭包>之后,就想着要去做一个富文本框的插件的例子.

JQuery 文本框高亮显示插件

JQuery 文本框高亮显示插件相关推荐

最新文章

热门文章