input框内默认文字点击消失
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<script type="text/javascript">
function addLoadEvent(func){
var oldonload = window.onload;
if(typeof window.onload!= 'function' ){
window.onload = func;
}
else{
window.onload = function(){
oldonload();
func();
}
}
}
var inputtext = function(){
var inputs = document.getElementsByTagName('INPUT');
for(var i=0; i<inputs.length; i++){
var str = "gray_input";
if(str.indexOf(inputs[i].className)==-1) continue;
var element = inputs[i];
element.onfocus = function() {
if (this.value == this.defaultValue) {
this.value = "";
this.className = "gray_input2";
}
}
element.onblur = function() {
if (this.value == "") {
this.value = this.defaultValue;
this.className = "gray_input";
}
}
}
} addLoadEvent(inputtext);
</script>
<style>
.gray_input{color:#878787;}
.gray_input2{color:#444;}
</style>
</head> <body>
<input name="text2" type="text" id="main_search3" class="gray_input" value="搜一下问题来回答"/>
</body>
</html>
input框内默认文字点击消失的更多相关文章
- HTML5轻松实现搜索框提示文字点击消失---及placeholder颜色的设置
在做搜索框的时候无意间发现html5的input里有个placeholder属性能轻松实现提示文字点击消失功能,之前还傻傻的在用js来实现类似功能... 示例 <form action=&quo ...
- 鼠标点击input框后里面的内容就消失
<!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...
- input框的默认bug解决办法
input框的默认bug是在没干掉边框的情况下是不能设置背景颜色的,否则边框会变成内边框(黑色)效果,很难看. 解决办法是: none掉input框的边框:border:none; 再设置其背景色为任 ...
- 设计input搜索框提示文字点击消失的效果
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...
- 消除input框的默认样式
input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...
- 类似input框内最右边添加图标,有清空功能
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- input内文字点击消失 弹出层,可以写表单
<!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...
- js实现鼠标点击input框后里面的内容就消失代码
<!--# <a href="http://www.mianfeimoban.com/texiao_mb/" target="_blank" cla ...
- ECSHOP搜索框文字点击消失
<input name="keywords" type="text" id="keyword" value="黄山金银币&q ...
随机推荐
- Android异步下载图片并且缓存图片到本地
Android异步下载图片并且缓存图片到本地 在Android开发中我们经常有这样的需求,从服务器上下载xml或者JSON类型的数据,其中包括一些图片资源,本demo模拟了这个需求,从网络上加载XML ...
- Spring学习总结(1)——Spring AOP的概念理解
1.我所知道的aop 初看aop,上来就是一大堆术语,而且还有个拉风的名字,面向切面编程,都说是OOP的一种有益补充等等.一下子让你不知所措,心想着:怪不得 很多人都和我说aop多难多难 .当我看进去 ...
- Android核心分析 之十Android GWES之基本原理篇
Android GWES基本框架篇 我这里的GWES这个术语实际上从Microsoft 的Window上移植过来的,用GWES来表示Android的窗口事件系统不是那么准确,在Android中Wind ...
- python urllib2的proxyhandler
1. 再a方法中新建了个opener,使用了代理: proxydict = {} proxydict['http'] = "http://%s:%s"%(ip,port) #pri ...
- PHP使用CURL详解
CURL是一个非常强大的开源库,支持很多协议,包括HTTP.FTP.TELNET等,我们使用它来发送HTTP请求.它给我 们带来的好处是可以通过灵活的选项设置不同的HTTP协议参数,并且支持HTTPS ...
- Java SpringMVC实现国际化整合案例分析(i18n)
所谓国际化就是支持多种语言,web应用在不同的浏览环境中可以显示出不同的语言,比如说汉语.英语等.下面我将以具体的实例来举例说明: (1)新建动态Javaweb项目,并导入几个SpringMVC必需的 ...
- 用状态矩阵解决有序操作的case爆炸问题(转载)
转自http://qa.baidu.com/blog/?p=167 作者:qabloger 一. 简介 我们在测试中可能都会面对case爆炸问题.有的case组合是无序的,我们可以通过pict[1]组 ...
- Socket 通信原理(Android客户端和服务器以TCP&&UDP方式互通)
转载地址:http://blog.csdn.net/mad1989/article/details/9147661 ZERO.前言 有关通信原理内容是在网上或百科整理得到,代码部分为本人所写,如果不当 ...
- python 中的集合(set) 详解
在Python set是基本数据类型的一种集合类型,它有可变集合(set())和不可变集合(frozenset)两种. 创建集合set.集合set添加.集合删除.交集.并集.差集的操作都是非常实用的方 ...
- U3D NGUI改变GameObject Activity闪烁的问题
不是关闭再激活GameObject会闪烁,而是再激活时,NGUI渲染步骤不一致导致的闪烁. 并且文字激活后渲染要慢一帧,如果延迟一帧处理,又会导致精灵图片快一帧,图片重叠.这个测试结果不一定准确,先记 ...