焦点事件，当一个元素（比如链接或表单）得到或失去焦点时发生。

实例：

 1 <!DOCTYPE html>

 2 <html lang="en">

 3 <head>

 4     <meta charset="UTF-8">

 5     <title>焦点事件</title>

 6 </head>

 7 <body>

 8 <h1>失去焦点后转大写</h1>

 9 <p>输入字符，可以转换成大写！</p>

10 <input id="s">

11 <br><br>

12 <button>点击我，input失去焦点</button>

13 <p id="out">

14     <script >

15         var EL = document.getElementById('s');

16         EL.addEventListener('blur', checkkey, false);

17

18         function checkkey(e){

19             var str = EL.value;

20             alert("你输入的字符是："+str);

21             out.textContent=str.toUpperCase();

22         }

23     </script>

24 </body>

25 </html>

JavaScript 焦点事件的更多相关文章

  1. JavaScript焦点事件、鼠标事件和滚轮事件使用详解

    网址:http://www.jb51.net/article/78094.htm

  2. JavaScript文本框焦点事件

    效果图如下: <!-- 当文本框获得焦点时候,如果文本框内容是 请输入搜索关键字 清空文本框,输入内容变黑色 --> <!-- 当文本框失去焦点时候,如果文本框无内容,则添加灰色的 ...

  3. Javascript高级编程学习笔记（62）—— 事件（6）焦点事件

    焦点事件 焦点事件会在页面元素获得或者失去焦点时触发,利用焦点事件和 document.hasFocus() 方法配合使用 以及 document.activeElement 属性配合可以知晓用户在页 ...

  4. jquery 触发/失去焦点事件例子详解

    触发焦点: $("Element").focus() 触发每一个匹配元素获得焦点事件. $("Element").focus(function) 事件会在获得焦 ...

  5. JavaScript焦点轮播图

    在慕课学习了JavaScript焦点轮播图特效,在此做一个整理. 首先是html结构,我用的是本地同文件夹下的三张图片,多出来的第一张(pic3副本)和最后一张图片(pic1副本)是为了实现无缝切换效 ...

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

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

  7. jquery之鼠标失去焦点事件

    <%@ page language="java" contentType="text/html; charset=UTF-8" pageEncoding= ...

  8. Javascript知识——事件

    O(∩_∩)O~~又是新的一周开始了,今天还是在继续学习Javascript知识,今天主要讲了事件的知识.现在就总结下吧. 事件 事件一般是用于浏览器和用户操作进行交互.最早是 IE 和 Netsca ...

  9. JavaScript系列----事件机制

    1.事件流 1.1.标准事件流 所谓的标准事件流指的的:EMCAScript标准规定事件流包含三个阶段,分别为事件捕获阶段,处于目标阶段,事件冒泡阶段. 下面是一段html代码,根据代码来说明标准事件 ...

随机推荐

  1. Go1.14版本vendor和gomodule冲突问题

    Go1.14版本vendor和gomodule冲突问题 go1.14版本使用go mod tidy构建依赖时会出现问题(见链接), 这个问题在go1.12版本是不会出现的. https://githu ...

  2. 5大知名的BI工具对比介绍

    工欲善其事,必先利其器.企业对于BI工具的需求,已经刻不容缓.国内国外的BI工具不少,如Tableau.FineBI.Power BI.Smartbi等等.本文就对当下市面上最热门的5款知名的BI工具 ...

  3. 【c#新手学习 练习 案例】 阶段项目一：开发团队调度软件

    案例是模仿java https://blog.csdn.net/bjfu170203101/article/details/109322590 改用C#:开发环境   vs2022/vscode .n ...

  4. 广度优先搜索（BreadthFirstSearch）& 迪克斯特拉算法 （Dijkstra's algorithm）

    BFS可回答两类问题: 1.从节点A出发,有前往节点B的路径吗? 2.从节点A出发,前往节点B的哪条路径经过的节点最少? BFS中会用到"队列"的概念.队列是一种先进先出(FIFO ...

  5. 入门不容易->先从数组说起

    数据结构,平时用得最多,接触最多的也是数组,先从数组说起. 数组的概念  什么是数组 一组数据,一秒钟可以申明1000个变量的骚操作. 存储相同的类型,连续的存储空间. 最重要的一点:按下标找元素. ...

  6. jq给手机号加密

    效果: HTML代码:     <!-- 1手机绑定 -->     <div class="memberuser_box">         <di ...

  7. 资源管理模式：Evictor模式

    Evictor模式描述了何时以及如何释放资源以优化资源管理.这个模式让我们可以配置不同的策略来自动决定哪些资源应该释放,以及应该在什么时候释放. 实例 考虑一个网络管理系统--管理多个网络元素.这些网 ...

  8. 2020.10.20 利用POST请求模拟登录知乎

    前两天学习了Python的requests模块的相关内容,对于用GET和PSOT请求访问网页以抓取需要的内容有了初步的了解,想要再从一些复杂的网站积累些经验.最开始我采用最简单的get(url)方法想 ...

  9. PhpStudy代码执行后门

    0x00 概述 只需要两个参数 Accept-Encoding: gzip,deflate Accept-Charset: Base64编码(PHP代码) 0x01 利用代码 加群可以下载:87369 ...

  10. CoLAKE: 如何实现非结构性语言和结构性知识表征的同步训练

    原创作者 | 疯狂的Max 论文CoLAKE: Contextualized Language and Knowledge Embedding 解读 01 背景与动机 随着预训练模型在NLP领域各大任 ...