在web开发中,我们有时会需要动态监听输入框值的变化,当使用onkeydown、onkeypress、onkeyup作为监听事件时,会发现一些复制粘贴等操作用不了,同时,在处理组合快键键的时候也很麻烦。这时候我们需要更专业的解决方案:HTML5标准事件oninput、onchange和IE专属的事件properchange。

1.oninput&onchange:

oninput和onchange都是事件对象,当输入框的值发生改变时触发该事件。不同的是,oninput是在值改变时立即触发,而onchange是在值改变后失去焦点才触发,并且可以用在非输入框中,如:select等。
 

2.propertychange:

功能同oninput,用以替代oninput在IE9以下的不兼容性。
 

3.output:

output是一个HTML5标签,IE系列浏览不兼容,主要用于计算输出。如:

propertychange 和 input 事件:

1)propertychange只要当前对象的属性发生改变就会触发该事件

2)input是标准的浏览器事件,一般应用于input元素,当input的value发生变化就会发生,无论是键盘输入还是鼠标黏贴的改变都能及时监听到变化

$(function(){

$('#username').bind('input propertychange', function() {

$('#result').html($(this).val().length + ' characters');

});

})

这里bind同时绑定了input和propertychange两个方法。

转:http://www.codes51.com/article/detail_3922282.html

实时监控input输入值变化的更多相关文章

  1. 移动端(html5)微信公众号下用keyup实时监控input值的变化无效

    搜索框依据用户输入的值实时检索,一开始自然而然想到keyup,在拼音状态时,啥问题也没有, 问题1:切换到中文输入法,问题出来了,keyup事件不灵便了,后来在网上搜了下,找到了思路, 问题2:微信公 ...

  2. jQuer实时监控input对table进行筛选

    记得以前写过一个预定表格~~~~~比这个更难,一大串前端js~~~忘了~~~好记性不如烂笔头~~记录下,既帮助别人,也帮助自己~~~ 实现思路~通过.on监听input标签的内容变化,通过this获取 ...

  3. 实时监控mysql数据库变化

    对于二次开发来说,很大一部分就找找文件和找数据库的变化情况 对于数据库变化.还没有发现比较好用的监控数据库变化监控软件. 今天,我就给大家介绍一个如何使用mysql自带的功能监控数据库变化 1.打开数 ...

  4. java实时监控mysql数据库变化

    对于二次开发来说,很大一部分就找找文件和找数据库的变化情况 对于数据库变化.还没有发现比较好用的监控数据库变化监控软件. 今天,我就给大家介绍一个如何使用mysql自带的功能监控数据库变化 1.打开数 ...

  5. 160411、实时监控mysql数据库变化

    对于二次开发来说,很大一部分就找找文件和找数据库的变化情况 对于数据库变化.还没有发现比较好用的监控数据库变化监控软件. 今天,我就给大家介绍一个如何使用mysql自带的功能监控数据库变化 1.打开数 ...

  6. 实时监测input输入变化 jQuery

    $('#production_name').on('input propertychange',function(){ alert('输入一个字弹一回'); });

  7. Zookeeper+websocket实现对分布式服务器的实时监控(附源码下载)

    ​ 我就是个封面 Zookeeper简介 Zookeeper是Hadoop的一个子项目,它是分布式系统中的协调系统. 简单来说就是一个Zookeeper注册同步中心,内部结构为一个树形目录,每个节点上 ...

  8. 使用jQuery实时监听input输入值的变化

    //jQuery实时监听input值变化 $("#email").on("input propertychange",function(){ var str = ...

  9. java利用WatchService实时监控某个目录下的文件变化并按行解析(注:附源代码)

    首先说下需求:通过ftp上传约定格式的文件到服务器指定目录下,应用程序能实时监控该目录下文件变化,如果上传的文件格式符合要求,将将按照每一行读取解析再写入到数据库,解析完之后再将文件改名. 一. 一开 ...

随机推荐

  1. Spark性能优化【Stack Overflow】

    一.异常情况 Stack Overflow 二.异常分析 之所以会产生Stack Overflow,原因是在Stack方法栈中方法的调用链条太长的原因导致的,一般情况有两种: 1.过于深度的递归[常见 ...

  2. c# .Net随机生成字符串代码

    /// <summary> /// 随机生成字符串 /// </summary> /// <param name="OperationType"> ...

  3. mssql sqlserver for xml EXPLICIT 用法详解说明

    摘要:下文通过举例的方式,详细说明"for xml EXPLICIT"关键字的用法,如下所示:实验环境:sql server 2008 R2 EXPLICIT的功能:将数据表采用特 ...

  4. SQL server分离和附加数据库

    下文是参考网友的文章结合自身的经验来总结的 应用于将数据库更改到同一计算机或不同计算机的不同SQL server实例中,或者要移动数据库文件存储的位置时. 一.分离数据库 将数据库从SQL serve ...

  5. 四、Tableau如何设置数据格式

    一.要求 ‘销售额’:K为单位 ‘利润’:        M为单位,负值用括号括起来,但是正值 ‘利润率’:带百分号,负值用括号括起来仍然时负值 二.解决方案 1.‘销售额’:m为单位 2.‘利润’: ...

  6. Python比较(关系)运算符

    比较(关系)运算符 运 算 符 作 用   举 例  结 果  >  大于 'a'>'b'   False  <  小于  156<456  True  ==  等于  'c' ...

  7. 简单易懂的程序语言入门小册子(4):基于文本替换的解释器,递归,如何构造递归函数,Y组合子

    递归.哦,递归. 递归在计算机科学中的重要性不言而喻. 递归就像女人,即令人烦恼,又无法抛弃. 先上个例子,这个例子里的函数double输入一个非负整数$n$,输出$2n$. \[ {double} ...

  8. Vue学习之路5-v-model指令

    1. 指令释义 v-model在表单控件或者组件上创建双向绑定,本质上是负责监听用户的输入事件(onchange,onkeyup,onkeydown等,具体是哪个,还请查阅官方底层实现文档)以更新数据 ...

  9. Java入门(四):运算符优先级、关键字与保留字

    上次介绍了Java的运算符,今天来介绍下运算符的优先级,以及Java的关键字.保留字. 一.运算符优先级 序号 运算符 名称 目数 结合性 说明 1 [ ] 方括号 从左向右 优先级最高 . 点号 双 ...

  10. 【2018.08.13 C与C++基础】网络通信:阻塞与非阻塞socket的基本概念及简单实现

    一.前言 最近在做Matalb/Simulink与C/C++的混合编程,主要是完成TCP.UDP.SerialPort等常见通信方式的中间件设计,为Simulink模型提供数据采集及解析模块. 问题在 ...