onblur 对象失去焦点事件

一、总结

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

二、简介

onblur 事件

定义和用法

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

语法

onblur="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

三、实例

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

 <tr>

     <td>确认密码：</td>

     <td><input type="password"  id="st4" onblur="check()"></td>

 </tr>

 <script type="text/javascript">

         //自定义通过ID获取元素的函数

         function $(id){

             return document.getElementById(id)

         }

         function check(){

             var boo=$('st3').value==$('st4').value;

             if (boo) {

                 return true;

             }else{

                  alert('两次密码不一致')

             }

         }

 </script>

onblur 对象失去焦点事件的更多相关文章

  1. onblur鼠标失去焦点事件

  2. 简单总结焦点事件、Event事件对象、冒泡事件

    每学习一些新的东西,要学会复习,总结和记录. 今天来简单总结一下学到的几个事件:焦点事件.Event事件对象.冒泡事件 其实这几个事件应该往深的说是挺难的,但今天主要是以一个小菜的角度去尝试理解一些基 ...

  3. js焦点事件:onfocus、onblur、focus()、blur()、select()

    焦点:使浏览器能够区分用户输入的对象,当一个元素有焦点的时候,那么他就可以接收用户的输入只有能够响应用户操作额元素才可以接收焦点事件,比如:a button input... onfocus:当元素获 ...

  4. js键盘事件和焦点事件

    键盘事件onkeydown //当键盘按下的时候触发onkeyup //但键盘抬起的时候触发event.keyCode //数字类型 键盘按键的键值功能键 ctrlkey shiftkey altke ...

  5. 浏览器根对象window之事件

    1. [事件]动画 onanimationstart onanimationend onanimationiteration onwebkitanimationend onwebkitanimatio ...

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

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

  7. Html 对象的常用事件列举

    事件名称 触发时间 对象例举 OnBlur 对象失去输入焦点 窗口和所有的表单对象 OnChange 用户改变对象的值 文本框.文本区域.选择列表等 OnClick 用户鼠标点击 链接.按钮.单选钮. ...

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

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

  9. 主动触发input框的失去焦点事件，阻止输入法跳出

    今天遇到个问题,我在手机做一个选择生日的功能,但是当我点击input框时,事件选择插件和输入法都弹出来了,很丑,然后就想阻止输入法弹出来, 网上一个方法是:在input框的获取焦点事件里,主动触发失去 ...

随机推荐

  1. 【BZOJ 1047】[HAOI2007]理想的正方形

    [链接] 我是链接,点我呀:) [题意] 在这里输入题意 [题解] 二维的ST表. 每个大的正方形可以由4个小的正方形组成. 然后区域内的最大值最小值.也可以由4个小的张方形部分全部覆盖到. [代码] ...

  2. 洛谷—— P2419 [USACO08JAN]牛大赛Cow Contest

    https://www.luogu.org/problem/show?pid=2419 题目背景 [Usaco2008 Jan] 题目描述 N (1 ≤ N ≤ 100) cows, convenie ...

  3. 9 hbase源码系列（九）StoreFile存储格式

    hbase源码系列(九)StoreFile存储格式    从这一章开始要讲Region Server这块的了,但是在讲Region Server这块之前得讲一下StoreFile,否则后面的不好讲下去 ...

  4. PHP经常使用功能

    1)字符串 主要方法有:strops().substr().str_split().explode()等.很多其它方法查看PHP官方手冊. <?php /** * 字符串的方法:strpos() ...

  5. SharePoint创建Alternate Access Mapping (AAM)备用訪问映射

    SharePoint创建Alternate Access Mapping (AAM)备用訪问映射         SharePoint的仓库是SQL Server中的内容数据库.这些数据库储存着组织全 ...

  6. LSTM模型

    摘自:http://www.voidcn.com/article/p-ntafyhkn-zc.html (二)LSTM模型 1.长短期记忆模型(long-short term memory)是一种特殊 ...

  7. Django 框架篇(四) : 视图(view)详解 以及 路由系统(url)

    |--Django的View(视图) |-- CBV和FBV: |-- 给视图增加装饰器: |-- request对象: |-- response对象: |-- Django的路由系统(url): | ...

  8. Object和其他类型的转换

    Object对象是一切类的父类(基类),只要是Object对象,可以强制转换为其他类型.

  9. Coderfroces 864 D. Make a Permutation!

    D. Make a Permutation! Ivan has an array consisting of n elements. Each of the elements is an intege ...

  10. Node测试文章收藏

    1.Nodejs实战—测试Node程序 讲解了TDD与BDD,TDD的基本原则,单元测试常用框架及使用,例如assert断言库,  chai断言库,  should.js断言库,断言库搭配测试框架(m ...