// 文本框文本域提示文字的自动显示与隐藏
(function($){
$.fn.textRemindAuto = function(options){
options = options || {};
var defaults = {
blurColor: "#999",
focusColor: "#333",
auto: true,
chgClass: ""
};
var settings = $.extend(defaults,options);
$(this).each(function(){
if(defaults.auto){
$(this).css("color",settings.blurColor);
}
var v = $.trim($(this).val());
if(v){
$(this).focus(function(){
if($.trim($(this).val()) === v){
$(this).val("");
}
$(this).css("color",settings.focusColor);
if(settings.chgClass){
$(this).toggleClass(settings.chgClass);
}
}).blur(function(){
if($.trim($(this).val()) === ""){
$(this).val(v);
}
$(this).css("color",settings.blurColor);
if(settings.chgClass){
$(this).toggleClass(settings.chgClass);
}
});
}
});
};
})(jQuery);

使用

使用很简单,方法是:textRemindAuto,最简单是使用类似下面代码:

$(".remindAuto").textRemindAuto();

参数
三个可控参数,一是默认的失去焦点的文字颜色,一个是文本框获得焦点时的文字颜色,还有一个就是切换显示的class,参见下面的实例:

$("#test").textRemindAuto({
blurColor: "green",
focusColor: "red",
chgClass: "change"
});

文本框/域文字提示(placeholder)自动显示隐藏jQuery小插件的更多相关文章

  1. javascript 文字大小自动适应文本框 (文字大小自动调整)

    javascript 文字大小自动适应文本框 (文字大小自动调整) TOC 思考 思考一:面积法 思考二:微调法 代码 在进行类似微博墙之类的展示页面中,经常会遇到这样的需求:在固定大小的区域放入字数 ...

  2. 小tip:FireFox下文本框/域百分比padding bug解决——张鑫旭

    一.问题描述 我是流体布局控,经常会遇到文本框以及文本域宽度100%自适应显示的情况. 如下效果图: 在窄屏下,上面的文本框宽度也要跟着外部宽度变小. 难点对于文本框或者文本域,光标最好距离左侧边缘有 ...

  3. iOS不得姐项目--登录模块的布局,设置文本框占位文字颜色,自定义内部控件竖直排列的按钮

    一.登录模块的布局 将一整部分切割成若干部分来完成,如图分成了三部分来完成 设置顶部状态栏为白色的方法 二.设置文本框占位文字颜色 <1>方法一与方法二实现原理是同一种,都是通过设置pla ...

  4. .Net 文本框实现内容提示(仿Google、Baidu)

    原文:.Net 文本框实现内容提示(仿Google.Baidu) 1.Demo下载: 文本框实现内容提示(仿Google.Baidu).rar 2.创建数据库.表(我用的sqlserver2008数据 ...

  5. 在chrome下的文本框sendkeys,提示element can't focus--解决方法

    在chrome下的文本框sendkeys,提示element can't focus--解决方法(成都-半步流雲,群友解决) 成都-半步流雲1.升级你的chromedriver,2.降chrome版本 ...

  6. TextBox 文本框水印文字

    #region TextBox 文本框水印文字 /// <summary> /// 基于.NET 2.0的TextBox工具类 /// </summary> public st ...

  7. checkbox/input文本框与文字对齐

    3种方法都能实现checkbox文本框或radio文本框与文字对齐: <meta charset="utf-8"> <input style="vert ...

  8. 如何用html把文本框外观格式设为只显示底部的横线

    html把文本框外观格式设为只显示底部的横线 <style> input[type='text']{background:none;border:none;border-bottom:1p ...

  9. IOS NSNotificationCenter(通知 的使用)监听文本框的文字改变

    监听文本框的文字改变 * 一个文本输入框的文字发生改变时,文本输入框会发出一个UITextFieldTextDidChangeNotification通知 * 因此通过监听通知来监听文本输入框的文字改 ...

随机推荐

  1. 获取http请求的响应状态

    import urllib.request url="http://www.baidu.com" #返回一个对象 response=urllib.request.urlopen(u ...

  2. python标准输入,标准输出,标准错误

    sys.stdout 与 print 当我们在 Python 中打印对象调用 print obj 时候,事实上是调用了 sys.stdout.write(obj+'\n') print 将你需要的内容 ...

  3. 标准块CP功能实现

    #include<stdio.h> int main(int argc,char *argv[]) { FILE *src_fp,*des_fp; int src_ret; ]={}; ) ...

  4. SpringBoot项目docker化

    前言 有很多种方案构建Docker镜像,包括Dockerfile构建.maven插件构建,这里我使用了最简单的Dockerfile构建的. 一.安装Docker 我的虚拟机系统是CentOS7,需要是 ...

  5. java 调用动态库打包sdk

    java连接c++动态库并生成jar包提供给别人调用 1.需要将java通过jni生成头文件,并导入到c++项目并对c++进行jni方法继承 在项目的src目录执行,否则会提示 错误:找不到符号 ja ...

  6. 浅谈Windows API编程

    WinSDK是编程中的传统难点,个人写的WinAPI程序也不少了,其实之所以难就难在每个调用的API都包含着Windows这个操作系统的潜规则或者是windows内部的运行机制…… WinSDK是编程 ...

  7. 数位dp总结 之 从入门到模板

    转发自WUST_WenHao巨巨的博客 基础篇 数位dp是一种计数用的dp,一般就是要统计一个区间[le,ri]内满足一些条件数的个数.所谓数位dp,字面意思就是在数位上进行dp咯.数位还算是比较好听 ...

  8. bootmanager is missing

    问题描述: 在计算机管理->存储->磁盘管理中,因误操作,将D盘设置了"将分区标记为活动分区(M)",导致重启时无法无法进入系统,提示"bootmanager ...

  9. d3学习笔记

    (1)使用enter()函数. 当要创建新的绑定数据的元素,必须使用enter().这个方法会分析当前选择的DOM元素和传给它的数据,如果数据值比对应的DOM元素多,就创建一个新的占位元素.然后把这个 ...

  10. Objective-c单例模式的正确写法--用dispatch 线程安全

    单例模式在iOS开发中可能算是最常用的模式之一了,但是由于oc本身的语言特性,想要写一个正确的单例模式相对来说比较麻烦,这里我就抛砖引玉来聊一聊iOS中单例模式的设计思路.关于单例模式更多的介绍请参考 ...