首页 >web前端 >js教程 >JQuery文本框高亮显示插件代码_jquery

JQuery文本框高亮显示插件代码_jquery

WBOY
WBOY原创
2016-05-16 18:08:401280浏览

代码如下:

jquery-highlight.js

复制代码 代码如下:

/*
description:TextBox HighLight
author: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代码:
复制代码 代码如下:





调用方法:
复制代码 代码如下:





效果如下:
JQuery文本框高亮显示插件代码_jquery
声明:
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系admin@php.cn