onblur 对象失去焦点事件

一、总结

1、几乎所有的控件都支持onblur事件

二、简介

onblur 事件

Event 对象

定义和用法

onblur 事件会在对象失去焦点时发生。

语法

οnblur="SomeJavaScriptCode"
参数 描述
SomeJavaScriptCode 必需。规定该事件发生时执行的 JavaScript。

支持该事件的 HTML 标签:

<a>, <acronym>, <address>, <area>, <b>, <bdo>, <big>, <blockquote>,
<button>, <caption>, <cite>, <dd>, <del>, <dfn>, <div>, <dl>, <dt>,
<em>, <fieldset>, <form>, <frame>, <frameset>, <h1> to <h6>, <hr>, <i>,
<iframe>, <img>, <input>, <ins>, <kbd>, <label>, <legend>, <li>,
<object>, <ol>, <p>, <pre>, <q>, <samp>, <select>, <small>, <span>,
<strong>, <sub>, <sup>, <table>, <tbody>, <td>, <textarea>, <tfoot>,
<th>, <thead>, <tr>, <tt>, <ul>, <var>

支持该事件的 JavaScript 对象:

button, checkbox, fileUpload, layer, frame, password,
radio, reset, submit, text, textarea, window

实例 1

在本例中,我们将在用户离开输入框时执行 JavaScript 代码:

<html>
<head>
<script type="text/javascript">
function upperCase()
{
var x=document.getElementById("fname").value
document.getElementById("fname").value=x.toUpperCase()
}
</script>
</head><body>输入您的姓名:
<input type="text" id="fname" onblur="upperCase()" /></body>
</html>

输出:

输入您的姓名:

TIY

onblur
如何使用 onblur 事件在用户离开输入框时执行 JavaScript 代码

参考:

onblur 事件
http://www.w3school.com.cn/jsref/event_onblur.asp

三、实例

验证两次输入的密码是否一致,重复输入密码框失去焦点的时候自动触发

1 <tr>
2     <td>确认密码:</td>
3     <td><inputtype="password"id="st4"onblur="check()"></td>
4 </tr>
5
6 <scripttype="text/javascript">
7         //自定义通过ID获取元素的函数
8         function$(id){9             returndocument.getElementById(id)10 }11
12         functioncheck(){13             varboo=$('st3').value==$('st4').value;14             if(boo) {15                 return true;16 }else{17 alert('两次密码不一致')18 }19
20 }21 </script>

转载于:https://www.cnblogs.com/Renyi-Fan/p/8973523.html

onblur 对象失去焦点事件相关推荐

  1. 2020.11.18第十三章 事件(事件处理程序;事件对象;事件类型:UI事件;焦点事件;鼠标与键盘事件 变动事件 模拟事件)

    事件处理程序 html事件处理程序(直接在html中书写script) <!-- //#### 事件处理程序 //html时间程序 可以直接在HTML文件中写,而且还可以引用其他地方的方法和函数 ...

  2. 鼠标点击失去焦点事件onblur

    鼠标点击获得焦点事件 onfocus 鼠标点击失去焦点事件 onblur 鼠标移动事件 onmouse vue 里的是@blur 是当元素失去焦点时所触发的事件 <template>< ...

  3. 在php中焦点事件,Js中的onblur和onfocus事件(图文教程)

    html页面中,诸如按钮.文本框等可视元素都具有拥有和失去焦点的事件,这些事件在响应鼠标或键盘动作时都可激发预设的操作.本文以文本框获得和失去焦点为例简单讲解onfocus和onblur的应用. 一. ...

  4. DIV焦点事件详解 --【focus和tabIndex】​

    添加 tabindex='-1' 属性: 默认:获取不到焦点事件(blur) 1 <div class="wl-product" id="wl-product&qu ...

  5. JavaScript之DOM对象(Event事件)

    文章目录 一.Event事件汇总 二.用法案例 1.serche搜索框 2.onload加载 3.事件绑定--标签内 4.事件绑定--JS接函数 5.onsubmit表单提交 6.事件传播 HTML ...

  6. 文本框焦点事件显示隐藏文本框内容

    效果展示: 代码展示: <!DOCTYPE html> <html><head><meta charset="utf-8">< ...

  7. Onblur的点击事件

    Onblur的事件 onblur 的事件会在对象失去焦点时发生. 语法 οnblur="SomeJavaScriptCode" 具体实例: 细心的朋友在上网注册时候,当我们注册的时 ...

  8. 获得焦点与失去焦点事件

    一 介绍 获得焦点事件(onfocus)是当某个元素获得焦点时触发事件处理程序. 失去焦点事件(onblur)是当前元素失去焦点时触发事件处理程序. 一般情况下,这两个事件是同时使用的. 二 应用 文 ...

  9. Javaweb-JavaScript失去焦点事件

    首先,JavaScript的事件分为静态注册事件和动态注册事件,静态注册事件是通过html 标签的事件属性直接赋于事件响应后的代码:动态注册事件是是指先通过js 代码得到标签的dom 对象,然后再通过 ...

最新文章

  1. fastdfs上传文件_SpringBoot+FastDFS搭建分布式文件系统
  2. 数字加字符串用,隔开
  3. Fedora 30可能默认启用DNF的best模式
  4. 玩转Eureka+Ribbon系列之Ribbon的负载均衡策略
  5. HDU 2570 迷瘴
  6. python设计一个函数定义计算并返回n价调和函数_音乐编程语言musicpy教程(第三期) musicpy的基础语法(二)...
  7. VHDL基础 学习笔记
  8. Spring Boot(13)——使用RestTemplate
  9. url编码解码的三种方式
  10. 面向对象编程Sample(C#)
  11. iOS 全局变量(转)
  12. Atitit git 使用法v2 目录 1. Git客户端工具 1 1.1. Tortoisegit git gui 图形化工具。。 1 1.2. Ide中的git插件(eclipse idea
  13. 【优化算法】混沌博弈优化算法(CGO)【含Matlab源码 1803期】
  14. Springboot中使用JWT
  15. oracle安装包安装教程,oracle安装教程【搞定方案】
  16. 100个Python实战项目(十一)如何使用 Python 获取电话号码信息?
  17. lamp phpstudy mysql_Phpstudy 搭建服务器教程
  18. 阿里云服务器ECS建站教程
  19. 二维数组传参,用int指针接收
  20. lol人物模型提取(九)——终章

热门文章

  1. 如何满足二级数据服务之需
  2. iOS 分类添加属性
  3. 面试官:给我说一下 Spring MVC 拦截器的原理?
  4. 你确定你真的喜欢编程吗??
  5. 这些让人抓狂的烂代码,你碰到几种?
  6. Eclipse 修改所有文件默认编码为UTF-8
  7. Spring Cloud构建微服务架构:服务消费(基础)【Dalston版】
  8. Java集合:Integer.parseInt() String.substring()
  9. 后台开发技术--接入层设计
  10. 乐讯网python论坛_乐讯论坛