zoukankan      html  css  js  c++  java
  • 输入框预设文字

     1 <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
     2 <HTML>
     3  <HEAD>
     4   <TITLE> New Document </TITLE>
     5   <META NAME="Generator" CONTENT="EditPlus">
     6   <META NAME="Author" CONTENT="">
     7   <META NAME="Keywords" CONTENT="">
     8   <META NAME="Description" CONTENT="">
     9           <style>
    10             .font1{
    11                 color:#aaaaaa;
    12             }
    13             .font2
    14             {
    15                 color:black;
    16             }
    17         </style>
    18  </HEAD>
    19 
    20  <BODY>
    21 <p>1、鼠标经过时消失</p>
    22 <script>
    23 function OnEnter( field ) { if( field.value == field.defaultValue ) { field.value = ""; } }
    24 function OnExit( field ) { if( field.value == "" ) { field.value = field.defaultValue; } }
    25 </script>
    26 <input type="text" value="请输入您的姓名" onclick="this.value=''" onblur="this.value='请输入您的姓名'" />
    27 <script>
    28 function OnEnter( field ) { if( field.value == field.defaultValue ) { field.value = ""; } }
    29 function OnExit( field ) { if( field.value == "" ) { field.value = field.defaultValue; } }
    30 </script>
    31  <input  type="password" id="password" name="password"  value="输入密码...." onmouseover="this.focus(); OnEnter(this)" onmouseout="this.blur(); OnExit(this)" />
    32  
    33  <p>2、点击时消失</p>
    34 <input  type="text" id="username" name="username"  value="输入账号" onmouseover="this.focus(); OnEnter(this)" onmouseout="this.blur(); OnExit(this)" />
    35 
    36  <p>2、点击时消失并改变字体颜色</p>
    37  <input type="text" value="请输入搜索结果" class="font1" onblur="if(this.value==''){this.value='请输入搜索结果';this.className='font1'}" onfocus="if(this.value==this.defaultValue){this.value='';this.className='font2'}">
    38  </BODY>
    39 </HTML>
  • 相关阅读:
    呼叫中心架构设计
    呼叫中心架构设计
    python数据分析工具安装集合
    QQ 聊天机器人小薇 2.0.0 发布!
    QQ 聊天机器人小薇 2.0.0 发布!
    spark编程python实例
    Intellij idea配置scala开发环境
    stm32时钟设置函数
    ESP8266 TCP传输AT指令顺序
    WIFI接入Internet配置过程
  • 原文地址:https://www.cnblogs.com/zhicheng/p/3327855.html
Copyright © 2011-2022 走看看