搜索框

简介: 搜索框实列 Title .gg{ color:#dddddd; (浅灰色) } .

搜索框实列

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
    <style>
             .gg{
                  color:#dddddd;           (浅灰色)
            }
            .bb{
                  color:black;                  (黑色的字体)
             }
    </style>
</head>
<body>
         <input type="text" class="gg" value="请输入内容" onfocus="Focus(this);" onblur="Blur(this);"/>
<script>
     function Focus(ths){
            //查找第一种方式
            //document
            //第二种方式 (this)
            //ths
            ths.className = "bb";
            var current_val = ths.value;
            if(current_val == "请输入内容"){
                ths.value = ""
            }
      }
      function Blur(ths){
            var current_val = ths.value;
            if(current_val == "请输入内容" || current_val.trim().length == 0){
                   ths.value = "请输入内容";
                   ths.className == "gg";
             }
       }
</script>
</body>
View Code

 

相关文章
|
前端开发
一款比较不错的下拉菜单
#menu{ margin:0;  padding:0;  list-style:none;  font:14px Arial;  }#menu li{ float:left;margin:0...
673 0
|
Web App开发 JavaScript
|
前端开发 开发者
下拉菜单 | 学习笔记
快速学习下拉菜单
下拉菜单 | 学习笔记
|
XML 前端开发 Android开发
仿美团下拉
git 下载地址:https://github.com/nugongshou110/MeiTuanRefreshListView   实现原理: 美团的下拉刷新分为三个状态: 第一个状态为下拉刷新状态(pull to refresh),在这个状态下是一个绿色的椭圆随着下拉的距离动态改变其大小。 第二个部分为放开刷新状态(release to refresh),在这个状态下是一个帧动画
1003 0
|
Web App开发 移动开发 区块链
自定义地址栏与收藏夹中的图标
关于Favicon favicon 在英文中有几个别名,叫做 shortcut icon,website icon,tab icon,URL icon,bookmark icon,对应中文来说也叫作网页小图标、网站缩略图或收藏夹图标、书签图标。
1302 0
|
存储 JavaScript
行内表单 在统一行显示搜索框 下拉框 按钮
行内表单 在统一行显示搜索框 下拉框 按钮
行内表单 在统一行显示搜索框 下拉框 按钮
|
Java 数据库 JavaScript
java简单的实现搜索框的下拉显示相关搜索功能
最近做了一个简单的搜索框下面下拉显示相关搜索的功能,有点模仿百度的下拉展示相关搜索   先上个展示图 : 点击进入演示地址,大家可以输入长点的搜索,点击搜索,再输入之前搜索词的前面部分,看是否能展示出来   搜索框相关搜索的展示很简单,就是根据你的搜索词,去数据库中匹配,是否有类似的搜索词存...
1888 0

热门文章

最新文章