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

<!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. push submodule

    git status git add sparx git commit -m "message" git push

  2. js日期计算及快速获取周、月、季度起止日,获取指定日期周数以及星期几的小例子

    JS获取日期时遇到如下需求,根据某年某周获取一周的日期.如开始日期规定为星期四到下一周的星期五为一周. 格式化日期: function getNowFormatDate(theDate) { var ...

  3. ios 消息转发初探

    有时候服务器的接口文档上一个数据写的是string类型,这时候你就会直接把它赋值给一个label. 问题来了,有时候这个string的确是string,没有问题,有时候又是NSNumber,当然不管三 ...

  4. OC-Category

    分类-Category 1. 基本用途 如何在不改变原来类模型的前提下,给类扩充一些方法?有2种方式 l   继承 l   分类(Category) 2. 格式 分类的声明 @interface类名 ...

  5. layoutSubviews方法需要被调用的情况有哪些

    layoutSubviews方法:这个方法,默认没有做任何事情,需要子类进行重写 layoutSubviews在以下情况下会被调用: 1.init初始化不会触发layoutSubviews 但是是用i ...

  6. JQuery Easy Ui dataGrid 数据表格

    数据表格 - DataGrid 英文文档:http://www.jeasyui.com/documentation/index.php# 继承$.fn.panel.defaults,使用$.fn.da ...

  7. Swing杂记——Swing中引入Android的NinePatch技术，让Swing拥有Android的外观定制能力

    [摘要] 本文诣在展示如何在Swing中引入 NinePatch技术(早期有文章里中文译作九格图,暂且这么叫吧^_^,但此术非传统移动手机上的功能布局——九格图哦). [准备篇] Q:何为 NineP ...

  8. 使用vagrant部署开发环境

    参考文章:http://blog.smdcn.net/article/1308.html 准备工作: 下载安装 VirtualBox :https://www.virtualbox.org/ 下载安装 ...

  9. 再谈 X-UA-Compatible 兼容模式

    如何理解 IE 的文档兼容模式(X-UA-Compatible)? IE 浏览器支持多种文档兼容模式,得以因此改变页面的渲染效果. IE9 模式支持全范围的既定行业标准,包括 HTML5(草案), W ...

  10. [译]AngularJS中几种Providers(Factory, Service, Provider)的区别

    原文: http://blog.xebia.com/2013/09/01/differences-between-providers-in-angularjs/ 什么是Provider? Angula ...