input输入框鼠标焦点提示信息


Posted in Javascript onMarch 17, 2015

问题如标题:

鼠标点击到输入框(input)里的时候,输入框的提示消失,鼠标再移开,输入框提示出现。如图所示:

input输入框鼠标焦点提示信息

做法如下:

<input type="text" name="name" id="name" class="ind_cont_input ind_cont_inputioce1" onfocus="if (value =='请输入2-5个中文名字'){value =''}" onblur="if (value ==''){value='请输入2-5个中文名字'}" value="请输入2-5个中文名字">  

<input type="text" name="tel" id="tel" class="ind_cont_input ind_cont_inputioce2 ind_cont_inputboder1" value="请输入您的电话" onfocus="if (value =='请输入您的电话'){value =''}" onblur="if (value ==''){value='请输入您的电话'}"> 

注意点为input的onblur和onfocus属性。另外也有简单的if判断。很方便很实用。

以上就是本文所述的全部内容了,希望大家能够喜欢。

Javascript 相关文章推荐
基于jquery插件制作左右按钮与标题文字图片切换效果
Nov 07 Javascript
Extjs中RowExpander控件的默认展开问题示例探讨
Jan 24 Javascript
jquery通过closest选择器修改上级元素的方法
Mar 17 Javascript
js如何实现点击标签文字,文字在文本框出现
Aug 05 Javascript
jquery图片滚动放大代码分享(1)
Aug 25 Javascript
jquery实现select选择框内容左右移动代码分享
Nov 21 Javascript
bootstrap-treeview自定义双击事件实现方法
Jan 09 Javascript
jQuery中数据缓存$.data的用法及源码完全解析
Apr 29 Javascript
vue组件生命周期详解
Nov 07 Javascript
JavaScript实现猜数字游戏
May 20 Javascript
Vue项目中数据的深度监听或对象属性的监听实例
Jul 17 Javascript
如何制作自己的原生JavaScript路由
May 05 Javascript
原生JS实现LOADING效果
Mar 16 #Javascript
使用jQuery实现图片遮罩半透明坠落遮挡
Mar 16 #Javascript
jQuery+css3动画属性制作猎豹浏览器宽屏banner焦点图
Mar 16 #Javascript
JavaScript中使用Callback控制流程介绍
Mar 16 #Javascript
jquery图片切换插件
Mar 16 #Javascript
JavaScript中的方法重载实例
Mar 16 #Javascript
jquery中attr和prop的区别分析
Mar 16 #Javascript
You might like
日本收入最高的漫画家:海贼王作者版税年收入高达8.45亿元
2020/03/04 日漫
基于MySQL分区性能的详细介绍
2013/05/02 PHP
初识laravel5
2015/03/02 PHP
mysql alter table命令修改表结构实例详解
2016/09/24 PHP
php use和include区别总结
2019/10/13 PHP
jQuery调用RESTful WCF示例代码(GET方法/POST方法)
2014/01/26 Javascript
Chrome扩展页面动态绑定JS事件提示错误
2014/02/11 Javascript
jquery实现省市select下拉框的替换(示例代码)
2014/02/22 Javascript
jQuery子属性过滤选择器用法分析
2015/02/10 Javascript
微信小程序 富文本转文本实例详解
2016/10/24 Javascript
Jquery通过ajax请求NodeJS返回json数据实例
2016/11/08 NodeJs
JavaScript交换两个变量值的七种解决方案
2016/12/01 Javascript
Ajax实现不刷新取最新商品
2017/03/01 Javascript
js 概率计算(简单版)
2017/09/12 Javascript
基于es6三点运算符的使用方法(实例讲解)
2017/10/12 Javascript
关于Vue在ie10下空白页的debug小结
2018/05/02 Javascript
使用layui实现树形结构的方法
2019/09/20 Javascript
Vue使用自定义指令实现拖拽行为实例分析
2020/06/06 Javascript
Python学习之asyncore模块用法实例教程
2014/09/29 Python
Python基于opencv的图像压缩算法实例分析
2018/05/03 Python
python 读取DICOM头文件的实例
2018/05/07 Python
对命令行模式与python交互模式介绍
2018/05/12 Python
python字符串分割及字符串的一些常规方法
2019/07/24 Python
python爬虫搭配起Bilibili唧唧的流程分析
2020/12/01 Python
如何在Shell脚本中使用函数
2015/09/06 面试题
校三好学生主要事迹
2014/01/11 职场文书
告诉你怎样写创业计划书
2014/01/27 职场文书
企业员工爱岗敬业演讲稿
2014/08/26 职场文书
2014个人年度工作总结
2014/12/15 职场文书
2015年信访维稳工作总结
2015/04/07 职场文书
军训心得体会范文(2016最新篇)
2016/01/11 职场文书
《红领巾真好》教学反思
2016/02/16 职场文书
导游词之秦皇岛燕塞湖
2020/01/03 职场文书
nginx配置ssl实现https的方法示例
2021/03/31 Servers
部分武汉产收音机展览
2022/04/07 无线电
js 实现验证码输入框示例详解
2022/09/23 Javascript