<!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. JAVA实现Excel导出数据（以写好的Excel模版导出）

    工作中经常会有将后台数据以Excel导出的功能. 简单的方法有将response的contentType设置为application/vnd.ms-excel: 或在JSP页面直接设置成: <% ...

  2. web服务器【apache/nginx] 关闭目录的浏览权限

    web服务器[apache/nginx] 关闭目录的浏览权限 我的配置(将Options 中的Indexes干掉): <VirtualHost *:80> ServerAdmin webm ...

  3. 【原创】【ViewPager+Fragment】ViewPager中切换界面Fragment被销毁的问题分析

    ViewPager中切换界面Fragment被销毁的问题分析   1.使用场景 ViewPager+Fragment实现界面切换,界面数量>=3   2.Fragment生命周期以及与Activ ...

  4. 289. Game of Life

    题目: According to the Wikipedia's article: "The Game of Life, also known simply as Life, is a ce ...

  5. Java：IO流之字节流InputStream、OutputStream详解

    字节流: (抽象基类)InputStream类(读): (抽象基类)OutputStream类(写):   InputStream: 构造方法摘要 InputStream()              ...

  6. SQL Server ->> 关于究竟ALTER INDEX ... REBUILD会不会导致改变索引选项和Filegroup的验证

    其实之前做过类型的验证,不过影响不是特别深,只是记得不会改变DATA COMPRESSION,那今天再次遇到这个问题就再拿出来验证一下.随便写个脚本验证下.ALTER INDEX ... REBUIL ...

  7. Control Flow ->> Containers

    Sequence Container: 它的作用就是可以把一组任务绑定起来成为一个整体,这样Sequence本身就是具有了任务(task)的特性,比如TransactionOption.如果需要把一组 ...

  8. ubuntu下安装与测试mysql

    1.在决定安装mysql之前,要先确定系统是否已经安装mysql. 输入: 1 mysql 结果:说明尚未安装mysql The program 'mysql' is currently notins ...

  9. mysql命令分类（DML、DDL、DCL）

    DML:数据操作语言(操作数据) SELECT - 从数据库表中获取数据 UPDATE - 更新数据库表中的数据 DELETE - 从数据库表中删除数据 INSERT INTO - 向数据库表中插入数 ...

  10. SQL Server 联表字段合并查询

    经常遇到统计报表中,子表记录合并为一个字段的情况.例如:省表中各省经济水平前五的城市统计. 有如下两表:dbo.省 和 dbo.市 (好吧,你可能会吐槽为什么用中文表名,其实我是为了方便查找替换) 这 ...