失焦事件(onblur)

onblur事件与onfocus是相对事件,当光标离开当前获得聚焦对象的时候,触发onblur事件,同时执行被调用的程序。

如下代码, 网页中有用户和密码两个文本框。当前光标在用户文本框内时(即焦点在文本框),在光标离开该文本框后(即失焦时),触发onblur事件,并调用函数message()。

运行结果:

任务

补充右边编辑器第13行,当光标从密码文本框离开时,触发onblur 事件,调用message()函数。

<!DOCTYPE HTML>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title> 失焦事件 </title>
<script type="text/javascript">
function message(){
alert("请确定已输入密码后,在移开!"); }
</script>
</head>
<body>
<form>
用户:<input name="username" type="text" value="请输入用户名!" >
密码:<input name="password" type="text" value="请输入密码!" onblur="message()">
</form>
</body>
</html>

JS事件 失焦事件(onblur)onblur事件与onfocus是相对事件,当光标离开当前获得聚焦对象的时候,触发onblur事件,同时执行被调用的程序。的更多相关文章

  1. JS事件 卸载事件 当用户退出页面时(页面关闭、页面刷新等),触发onUnload事件,同时执行被调用的程序。注意:不同浏览器对onunload事件支持不同。

    卸载事件(onunload) 当用户退出页面时(页面关闭.页面刷新等),触发onUnload事件,同时执行被调用的程序. 注意:不同浏览器对onunload事件支持不同. 如下代码,当退出页面时,弹出 ...

  2. JS事件 文本框内容改变事件(onchange)通过改变文本框的内容来触发onchange事件,同时执行被调用的程序。

    文本框内容改变事件(onchange) 通过改变文本框的内容来触发onchange事件,同时执行被调用的程序. 如下代码,当用户将文本框内的文字改变后,弹出对话框"您改变了文本内容!&quo ...

  3. JS事件 鼠标移开事件(onmouseout)鼠标移开事件,当鼠标移开当前对象时,执行onmouseout调用的程序。

    鼠标移开事件(onmouseout) 鼠标移开事件,当鼠标移开当前对象时,执行onmouseout调用的程序. 当把鼠标移动到"登录"按钮上,然后再移开时,触发onmouseout ...

  4. JS事件 加载事件(onload)注意:1. 加载页面时,触发onload事件,事件写在<body>标签内。 2. 此节的加载页面,可理解为打开一个新页面时。

    加载事件(onload) 事件会在页面加载完成后,立即发生,同时执行被调用的程序. 注意:1. 加载页面时,触发onload事件,事件写在<body>标签内. 2. 此节的加载页面,可理解 ...

  5. JS改变input的value值不触发onchange事件解决方案 (转)

    方法(一)(转载的网络资料) 需要了解的知识     首先,我们需要了解onchange和onpropertychange的不同: IE下,当一个HTML元素的属性改变的时候,都能通过 onprope ...

  6. js jq输入框中按回车触发提交事件,用户在页面输入后按回车(Enter键)进行

    js jq输入框中按回车触发提交事件,用户在页面输入后按回车(Enter键)进行 代码如下: <!DOCTYPE html> <html lang="en" xm ...

  7. js 触发 change 事件

    首先,请各位包涵,我本人对 JS 不是很熟,不知道"触发change事件"和"触发onchange事件"哪个更加合适.有园友知道的麻烦指出,先行谢过. 起因是这 ...

  8. [转]FireFox与IE 下js兼容触发click事件的代码

    本文转自:http://www.jb51.net/article/16549.htm FireFox与IE 下js兼容触发click事件 ,对于需要兼容这两者的朋友,就需要参考下下面的代码了<a ...

  9. js/jq 动态添加的元素不能触发绑定事件解决方案

    <!-- Copyright 2017-10-27, Jachin QQ: 381558301 Email: 381558301@qq.com 请看看你们的版本并对号入座: jquery1.6版 ...

随机推荐

  1. vue-lic脚手架中引入font-awesome

    1.安装font-awesome npm i font-awesome --production 2.在main.js中引用 import 'font-awesome/css/font-awesome ...

  2. JUC源码分析-集合篇(一)ConcurrentHashMap

    JUC源码分析-集合篇(一)ConcurrentHashMap 1. 概述 <HashMap 源码详细分析(JDK1.8)>:https://segmentfault.com/a/1190 ...

  3. CDH6.1.0离线安装——笔记

    一. 概述 该文档主要记录大数据平台的搭建CDH版的部署过程,以供后续部署环境提供技术参考. 1.1 主流大数据部署方法 目前主流的hadoop平台部署方法主要有以下三种: Apache hadoop ...

  4. 总分 Score Inflation

    题目背景 学生在我们USACO的竞赛中的得分越多我们越高兴. 我们试着设计我们的竞赛以便人们能尽可能的多得分,这需要你的帮助 题目描述 我们可以从几个种类中选取竞赛的题目,这里的一个"种类& ...

  5. Java中equals和hashcode的区别?

    Java中equals和hashcode方法是在Object对象中的,所以每个对象都有这两个方法,大多数时候我们为了实现特定需求需要重写这两个方法 equals和hashcode方法常用在同一个类中用 ...

  6. docker学习---搭建Docker LAMP环境

    1.环境 系统版本:CentOS Linux release 7.4.1708 docker版本:docker-ce-18.09 主机IP:192.168.121.121 2.载入MySQL和PHP镜 ...

  7. CSRF攻击防御方法

    CSRF攻击防御方法 目前防御 CSRF 攻击主要有三种策略: 1. 验证 HTTP Referer 字段: 根据 HTTP 协议,在 HTTP 头中有一个字段叫 Referer,它记录了该 HTTP ...

  8. Vultr账号被锁定的几个常见原因

    很多小伙伴使用都在问Vultr账号为什么又是会出现被锁定的情况,今天我们就来了解一下Vultr账号被锁定的几个常见原因. 1.Vultr主机违规使用 按照Vultr主机商的要求,我们的Vultr主机也 ...

  9. Centos6.5升级安装openssh7.7p1

    Centos6.5升级安装openssh7.7p1  关于OpenSSH漏洞   2016年1月14日OpenSSH发布官方公告称, OpenSSH Client 5.4~7.1 版本中未公开说明的功 ...

  10. delphi 单元 MSHTML 之Ihtmldocument2

    delphi : Ihtmldocument2接口的利用 MSHTML是微软公司的一个COM组件,该组件封装了HTML语言中的所有元素及其属性,穿越其供给的规范接口,能够访问指定网页的所有元素. MS ...