输入框的 change 和 blur  事件绝大多数情况下表现是一致的，输入结束后离开输入框会先后触发 change 和 blur。那么这两个事件的区别在哪呢？

当文本框获得焦点后，没有输入任何内容，或者最终文本框的值没有改变时，是不会触发 change 事件的，而 blur 事件始终会触发。如果希望文本框的值一发生改变就立马执行某些操作，而不是等到离开再执行，那么可以使用 keyup 事件。

input 输入框 change 事件和 blur 事件的更多相关文章

  1. input输入框change和blur事件区别

    blur与change事件在绝大部分的情况下表现都非常相似,输入结束后,离开输入框,会先后触发change与blur,唯有两点例外. 1.没有进行任何输入时,不会触发change 在这种情况下失焦后, ...

  2. jquery点击click事件和blur事件冲突如何解决

    最近做了一个查询小功能,input输入框输入文字后,自动列出几条查询结果,可以键盘上下键或鼠标进行查询结果选择,并且点击输入框其他地方要隐藏这个列出的结果. 但比较头疼的是input上添加blur事件 ...

  3. 【五】jquery之事件（focus事件与blur事件）[提示语的出现及消失时机]

    例题:当鼠标移动到某个文本框时,提示语消失. 当失去焦点时,如果该文本框有内容,保存内容.没有内容,则恢复最初的提示语句 <!DOCTYPE html> <html> < ...

  4. 【jQeury】input输入框状态，input事件，blur事件，focus事件

    //输入框正在输入时 $("#test1").on('input',function(){ alert('正在输入'); }) //输入框得到焦点时 $("#test2& ...

  5. input输入框，回车激活按钮事件代码

    <input type="text" name="输入框ID" id="输入框ID" onkeypress="if(even ...

  6. 让HTML标签、DIV、SPAN拥有focus事件和blur事件，聚焦和失焦

    DIV和其他普通标签是不具有onfocus和onblur事件的.INPUT和A标签为什么拥有?而DIV和SPAN等普通标签却没有?有时候我们习惯性用键盘的TAB来移动光标,仔细看你会发现,光标只在IN ...

  7. 【原】相煎何太急——input的blur事件与button的click事件

    先来一段引子,最近在写手机h5页面,主要是一些登陆注册方面的,最绕不开的就是表单元素. 我想实现的是:在输入框后边有一个删除图标,当输入东西的时候触发事件,显示删除图标,点击该图标会删除之前输入的内容 ...

  8. jq 实时监听input输入框的变化

    项目需求中有时候需要实时监测 input 的值变化,虽然 input 自身有 focus 和 blur 事件,但是有时候跟需求不符合. 所以实时监听 input 值变化的代码为: $("#i ...

  9. input输入框的的input事件和change事件以及change和blur事件的区别

    input输入框的 oninput事件 ,在用户输入的时候触发,只要元素值发生变化就会触发 input输入框的 onchange事件 ,要在输入框失去焦点的时候触发事件,当鼠标在其他地方点击一下才会触 ...

随机推荐

  1. 发现一个好玩的东西 Web Scraper

    是一个 Chrome 的扩展程序,机智的小爬虫

  2. create-react-app脚手架中配置webpack的方法

    概述 create-react-app脚手架中的react-scripts能够(1)帮我们自动下载需要的webpack依赖:(2)自己写了一个nodejs服务端脚本代码:(3)使用express的Ht ...

  3. jQuery应用实例3：全选、二级联动

    全选: 这里是用JS实现的:http://www.cnblogs.com/xuyiqing/p/8378221.html 如果使用jQuery则会方便很多: <!DOCTYPE html> ...

  4. JavaScript中子类调用父类方法的实现

    一.前言 最近在项目中,前端框架使用JavaScript面向对象编程,遇到了诸多问题,其中最典型的问题就是子类调用父类(super class)同名方法,也就是如C#中子类中调用父类函数base.** ...

  5. Shell - 简明Shell入门15 - 调试（Debug）

    示例脚本及注释 #!/bin/bash -x for filename in t1 t2 t3 do touch $filename.txt echo "Create new file: $ ...

  6. 自动化测试工具selenium webdirver

    看视频学到的,自动化测试工具,可以模拟用户操作,包括输入,点击等操作 新建新文件夹 在命令行执行npm init  ,一路回车,把项目先初始化 安装  npm install selenium-web ...

  7. 什么是js的严格模式

    设立严格模式的原因: - 消除Javascript语法的一些不合理.不严谨之处,减少一些怪异行为; - 消除代码运行的一些不安全之处,保证代码运行的安全: - 提高编译器效率,增加运行速度: - 为未 ...

  8. MySQL百万级、千万级数据多表关联SQL语句调优

    本文不涉及复杂的底层数据结构,通过explain解释SQL,并根据可能出现的情况,来做具体的优化,使百万级.千万级数据表关联查询第一页结果能在2秒内完成(真实业务告警系统优化结果).希望读者能够理解S ...

  9. Docker应用场景

    Docker的应用场景 Web 应用的自动化打包和发布. 自动化测试和持续集成.发布. 在服务型环境中部署和调整数据库或其他的后台应用. 从头编译或者扩展现有的OpenShift或Cloud Foun ...

  10. LearnOpenGL学习笔记（一）——现有代码理解

    首先,给出这次学习的代码原网址.------>原作者的源代码 (黑体是源码,注释是写的.) 引用的库(预编译): #include <glad/glad.h> //控制编译时函数的具 ...