<!doctype html>

<html>

<head>

<meta charset="utf-8">

<meta name="author" content="智能社 - zhinengshe.com">

<meta name="copyright" content="智能社 - zhinengshe.com">

<title>智能社 - www.zhinengshe.com</title>

<style>

* { margin:; padding:; }

.box {position:relative; width:200px; margin:50px auto;}

.box span { position:absolute; top:; left:5px; height:40px; line-height:40px; color:#; }

#inp1,#pass{ position:absolute; top:; left:; border:1px solid #; /* border:none 0;这个是兼容的写法 */

outline:none;width:190px; height:40px; line-height:40px; padding: 5px; background:none;}

#pass{top:55px;}

input::-ms-clear { display:none; } /* 去掉IE10输入框后的叉号 */

input::-ms-reveal{ display:none;}    /* 去掉输入密码时的眼睛 */

</style>

<script>

window.onload=function (){

    var oInp=document.getElementById('inp1');

    var oSpan=document.getElementById('span1');

    oInp.onfocus=function (){

        oSpan.style.display='none';

    };

    oInp.onblur=function (){//失去焦点判断输入为空时

        if (oInp.value.length == )

        {

            oSpan.style.display='block';

        }

    };

    oSpan.onclick=function (){//点击提示文字时情况

        oInp.focus();

    };

};

</script>

</head>

<body>

    <div class="box">

        <input type="text" id="inp1" />

        <span id="span1">我是提示文字</span>

        <input type="password" id="pass"/>

    </div>

</body>

</html>

js获得焦点和失去焦点那些事的更多相关文章

  1. js捕捉IE窗口失去焦点事件,判断离开页面刷新或关闭的方法

    js捕捉IE窗口失去焦点事件,判断离开页面刷新或关闭的方法 javascript如何捕捉IE窗口失去焦点事件window.onblur = function(e) { //you code}; 弹框的 ...

  2. (三)在js(jquery)中获得文本框焦点和失去焦点的方法

    在js(jquery)中获得文本框焦点和失去焦点的方法   文章介绍两个方法和种是利用javascript onFocus onBlur来判断焦点和失去焦点,加一种是利用jquery $(" ...

  3. react.js 你应知道的9件事

    React.js 初学者应该知道的 9 件事   本文假定你已经有了一下基本的概念.如果你不熟悉 component.props 或者 state 这些名词,你最好先去阅读下官方起步和手册.下面的代码 ...

  4. jquery得到焦点和失去焦点

    鼠标在搜索框中点击的时候里面的文字就消失了,经常会用到搜索框的获得焦点和失去焦点的事件,接下来介绍一下具体代码,感兴趣的朋友额可以参考下   input失去焦点和获得焦点 鼠标在搜索框中点击的时候里面 ...

  5. 键盘焦点和逻辑焦点（Logic Focus与Keyboard Focus ）

    键盘焦点和逻辑焦点(Logic Focus与Keyboard Focus ) 1.定义Keyboard Focus可以理解为物理焦点.就是整个桌面上可以响应键盘输入的地方,整个桌面在某个时刻只可能有一 ...

  6. 探讨 JS 的面向对象中继承的那些事

    最近学了 JS 的面向对象,这篇文章主要是探讨 JS 的面向对象中继承的那些事. JS中继承的特点: 1.子类继承父类: 2.子类可以用父类的方法和属性 3.子类的改变可以不影响父类 下面用一个例子来 ...

  7. PyQt（Python+Qt）学习随笔：键盘焦点和逻辑焦点（Logic Focus与Keyboard Focus ）

    老猿Python博文目录 专栏:使用PyQt开发图形界面Python应用 老猿Python博客地址 Qt中的焦点有键盘焦点和逻辑焦点(Logic Focus与Keyboard Focus )的区分,键 ...

  8. js判断回车，判断焦点控件

    document.onkeydown=function(event){        e = event ? event :(window.event ? window.event : null);  ...

  9. 通过自定义属性存储数据实现输入框获得焦点与失去焦点改变value值

    http://gopro.ee.cagoe.com/index.html     html: <div class="name"><input value=&qu ...

随机推荐

  1. Problem F: 等式

    Time Limit: 1 Sec  Memory Limit: 128 MBSubmit: 104  Solved: 22[Submit][Status][Web Board] Descriptio ...

  2. POJ 1679 The Unique MST （次小生成树）题解

    题意:构成MST是否唯一 思路: 问最小生成树是否唯一.我们可以先用Prim找到一棵最小生成树,然后保存好MST中任意两个点i到j的这条路径中的最大边的权值Max[i][j],如果我们能找到一条边满足 ...

  3. TeeChart取消3D

    tChart1.Aspect.View3D = false;//此属性默认是true 3d的效果 2d平面的效果 题外话,在使用控件的时候,需要注意: 在TChart控件上增加Series,   se ...

  4. 51NOD 1117 聪明的木匠

    来源:http://www.51nod.com/onlineJudge/questionCode.html#!problemId=1117 挑战原题吧  大概 每次挑选最小的两个,合起来 #inclu ...

  5. [echats] - EChats图表的使用

    从上图可以看到,信息是能被抽象化为图形展示的,也就是基本的图表,曲线(想想股票那种曲线,普及一下那个叫K线图,想起当初去北京面试炒股公司的时候了...),柱状图等. 而apache开源的echats正 ...

  6. [IDEA插件] - 一个不错的插件

    今天看到微信平台一篇推送IDEA插件的文章继而下载了个插件看了下. 名字叫做codehelper.generator codehelper.generator http://plugins.jetbr ...

  7. HDU 5876 Sparse Graph（补图中求最短路）

    http://acm.hdu.edu.cn/showproblem.php?pid=5876 题意: 在补图中求s到其余各个点的最短路. 思路:因为这道题目每条边的距离都是1,所以可以直接用bfs来做 ...

  8. Windows 上安装 MySQL

    Windows 上安装 MySQL https://www.mysql.com/downloads/ 1.下载MySQL安装包(官网下载链接): 选择 DOWNLOADS ——> Communi ...

  9. 消息/事件, 同步/异步/协程, 并发/并行 协程与状态机 ——从python asyncio引发的集中学习

    我比较笨,只看用await asyncio.sleep(x)实现的例子,看再多,也还是不会. 已经在unity3d里用过coroutine了,也知道是“你执行一下,主动让出权限:我执行一下,主动让出权 ...

  10. svg操纵方案 基于 D3 还是 angular？

    之前还是想简单了, 现在重新写这篇.把逻辑拆分粒度的辨析,放到外面去. 问题提出:svg控制方案 基于 D3 还是 angular 根据这个,html 4种展现样式:普通的html,svg,2D ca ...