<!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框内默认文字点击消失的更多相关文章

  1. HTML5轻松实现搜索框提示文字点击消失---及placeholder颜色的设置

    在做搜索框的时候无意间发现html5的input里有个placeholder属性能轻松实现提示文字点击消失功能,之前还傻傻的在用js来实现类似功能... 示例 <form action=&quo ...

  2. 鼠标点击input框后里面的内容就消失

    <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title> ...

  3. input框的默认bug解决办法

    input框的默认bug是在没干掉边框的情况下是不能设置背景颜色的,否则边框会变成内边框(黑色)效果,很难看. 解决办法是: none掉input框的边框:border:none; 再设置其背景色为任 ...

  4. 设计input搜索框提示文字点击消失的效果

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 消除input框的默认样式

    input, button, select, textarea { outline: none; -webkit-appearance: none; border-radius: 0; } outli ...

  6. 类似input框内最右边添加图标，有清空功能

    <html> <head> <meta http-equiv="Content-Type" content="text/html; char ...

  7. input内文字点击消失 弹出层，可以写表单

    <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" content ...

  8. js实现鼠标点击input框后里面的内容就消失代码

    <!--# <a href="http://www.mianfeimoban.com/texiao_mb/" target="_blank" cla ...

  9. ECSHOP搜索框文字点击消失

    <input name="keywords" type="text" id="keyword" value="黄山金银币&q ...

随机推荐

  1. C/C++类型转换

    1.隐式类型转换 1.1 隐式类型转换的规则 K & R A.6.5 Arithmetic Conversions(数值型间的转换)First, if either operand is lo ...

  2. TCP与UDP的不同接包处理方式

    TCP与UDP的不同接包处理方式 1.UDP发包的问题问:udp 发送两次数据,第一次 100字节 ,第二次200字节, 接包方一次recvfrom( 1000 ), 收到是 100,还是200,还是 ...

  3. python 详解re模块

    正则表达式的元字符有. ^ $ * ? { [ ] | ( )．表示任意字符［］用来匹配一个指定的字符类别,所谓的字符类别就是你想匹配的一个字符集,对于字符集中的字符可以理解成或的关系.^ 如果放在字 ...

  4. Java笔记——面向接口编程（DAO模式）

    1.DAO模式  DAO(Data Access Object)模式就是写一个类,把访问数据库的代码封装起来.DAO在数据库与业务逻辑(Service)之间.     l  实体域,即操作的对象,例如 ...

  5. Spring笔记——依赖注入

    依赖注入有三种方式: 1. 使用构造器注入  2. 使用属性setter方法注入 3. 使用Field注入(用于注解方式) 注入依赖对象可以采用手工装配或自动装配,在实际应用中建议使用手工装配,因为自 ...

  6. jQuery：balloon气泡提示插件

    插件下载地址:http://file.urin.take-uma.net/jquery.balloon.js-Demo.html <!DOCTYPE html PUBLIC "-//W ...

  7. 272. Closest Binary Search Tree Value II

    题目: Given a non-empty binary search tree and a target value, find k values in the BST that are close ...

  8. Objective-C：三种文件导入的方式以及atomic和nonatomic的区别

    一.三种文件导入的方式比较:   类的前项声明@class.import.include: 1.采用@class 类名的方式,它会告诉编译器有这么一个类,目前不需要知道它内部的实例变量和方法是如何定义 ...

  9. SSIS ->> Reliability And Scalability

    Error outputs can obviously be used to improve reliability, but they also have an important part to ...

  10. 【USACO】Milking Cows

    Three farmers rise at 5 am each morning and head for the barn to milk three cows. The first farmer b ...