文本框默认显示 “请输入关键字”，当鼠标点击输入框的时候， “请输入关键字”这几个字消失，移出文本框又显示出来

<!DOCTYPE html>

<html lang="en">

<head>

    <meta charset="UTF-8">

    <title>Title</title>

</head>

<body>

    <div style="width: 600px;margin: 0 auto;">

        <input id="i1" onfocus="Focus();" onblur="Blur();" type="text" value="请输入关键字"/>

        <input type="text" placeholder="请输入关键字" />

    </div>

    <script>

        function Focus(){

            var tag = document.getElementById('i1');

            var val = tag.value;

            if(val == "请输入关键字"){

                tag.value = "";

            }

        }

        function Blur(){

            var tag = document.getElementById('i1');

            var val = tag.value;

            if(val.length ==0){

                tag.value = "请输入关键字";

            }

        }

    </script>

</body>

</html>

HTML之文本框关键字显示的更多相关文章

  1. php 文本框里面显示数据库调出来的资料

    php 文本框里面显示数据库调出来的资料,,,在里面我标注了,,那个地方为什么是!=才能显示正确的数据库资料啊?我理解的是对比正确输出数据库内容的.大师貌似不知道为什么就写错了 <html> ...

  2. Jquery中复选框选中取消实现文本框的显示隐藏

    标签内容 <div class="box"> 请编写javascript代码,完成如下功能要求:<br /> 1.取消复选款后,要求促销价格.促销开始结束日 ...

  3. 设置文本框左边显示的View

    效果:

  4. input 文本框自动显示光标

    使用$("#votetitle").focus();没起作用 使用document.getElementById("votetitlechild").focus ...

  5. js实现文本框自动显示两位小数

    转自https://blog.csdn.net/qiji2011/article/details/81270552 1.js: //保留2位小数,如:2,会在2后面补上00.即2.00 functio ...

  6. 【MFC】MFC文本框中显示浮点数

    CString strNumber; strNumber.Format("%0.2f",tim.getTimeMilli()); SetDlgItemText(IDC_TIME_U ...

  7. iOS 9应用开发教程之显示编辑文本标签文本框

    iOS 9应用开发教程之显示编辑文本标签文本框 ios9显示.编辑文本 在iOS,经常会看到一些文本的显示.文字就是这些不会说话的设备的嘴巴.通过这些文字,可以很清楚的指定这些设备要表达的信息.本节将 ...

  8. Easyui datebox单击文本框显示日期选择 eayui版本1.5.4.1

    Easyui默认是点击文本框后面的图标显示日期,体验很不好,所以我想单击文本框就显示日期选择框,网上很多版本是1.3,1.4的,于是自己就比葫芦画瓢改了一个1.5.4.1的版本. 我参考了网上这个帖子 ...

  9. 分享一个仅0.7KB的jQuery文本框输入提示插件

    由于项目需要,找过几个jQuery文本框输入提示插件来用,但总是有不满意的地方,要么体积较大,要么使用不便,要么会出现把提示文字作为文本框的值的情况.于是我们自己的开发团队制作了这个最精简易用的输入提 ...

随机推荐

  1. Java——private default protected public访问控制权限

    访问控制权限 protected范例

  2. python- shutil 高级文件操作

    简介 shutil模块提供了大量的文件的高级操作.特别针对文件拷贝和删除,主要功能为目录和文件操作以及压缩操作.对单个文件的操作也可参见os模块. 拷贝文件 shutil.copyfile(src, ...

  3. target 事件属性

    定义和用法 target 事件属性可返回事件的目标节点(触发该事件的节点),如生成事件的元素.文档或窗口. 语法 event.target 实例 下面的例子可获得触发事件的元素: <html&g ...

  4. centos 命令大全

    文件操作: ls      ####查看目录中的文件#### ls -F       ####查看目录中的文件#### ls -l       ####显示文件和目录的详细资料#### ls -a   ...

  5. [转] 安装DotNetCore.1.0.1-VS2015Tools.Preview2.0.2出现0x80072f8a未指定的错误

    原文地址:安装DotNetCore.1.0.1-VS2015Tools.Preview2.0.2出现0x80072f8a未指定的错误 最近DotNetCore更新到了1.0.1,Azure tools ...

  6. vtk第一个程序

    首先 设置环境变量 解决方案资源管理器 选中项目名字 而不是ALL_BUILD 选项卡 项目-属性 右侧 附加依赖项->编辑 kernel32.libuser32.libgdi32.libwin ...

  7. Xshell4注册码,Xftp注册码

    Xshell 是一个强大的安全终端模拟软件,商业版注册码如下: Xshell 4 注册码: 690313-111999-999313 Xftp 4 注册码:101210-450789-147200 X ...

  8. ELK日志分析系统（转）

    原创作品,允许转载,转载时请务必以超链接形式标明文章 原始出处 .作者信息和本声明.否则将追究法律责任.http://467754239.blog.51cto.com/4878013/1700828 ...

  9. QT文件读写

    /* //文件读取 QFile f("c:\\t.txt"); if(!f.open(QIODevice::WriteOnly | QIODevice::Text)) { qDeb ...

  10. ECshop安装及报错解决方案总结

    一.安装ECshop ECShop是一款B2C独立网店系统 ,适合企业及个人快速构建个性化网上商店.系统是基于PHP语言及MYSQL数据库构架开发的跨平台开源程序.2006年3月推出以来1.0版以来, ...