jquery监听input元素输入

一般我们监听input内容的变化都是通过onchange()事件来绑定,但这个做法有一个缺陷就是只有当正在被输入的input元素失去焦点时(即鼠标点击了别处)才会触发,而实际上我们往往希望能够满足在用户输入过程中,在保持焦点不变的情况下随着输入内容的变化而触发一定事件处理函数(这样就不用劳烦用户用鼠标再点击以下别的地方)。

这种应用场景可以使用jquery的绑定技术

eg.

$("#gamount").bind(‘input propertychange‘,function(){
    grantnumchange();    });

即可在id为gamount的input元素内容发生变化(无需焦点改变)时就触发对应的事件处理函数。

时间: 2024-11-02 23:37:29

jquery监听input元素输入的相关文章

jquery 监听input输入值事件

<html> <head> <title></title> <script type="text/javascript" src="http://code.jquery.com/jquery-1.6.2.min.js"></script> </head> <script type="text/javascript"> $(function(){ //I

微信小程序监听input输入并取值

小程序的事件分为两种,冒泡和非冒泡事件,像<form/>的submit事件,<input/>的input事件,<scroll-view/>的scroll事件等非冒泡事件,需要到组件的文档里去找,如下是我截图的一些常用的非冒泡事件 非冒泡事件:当一个组件上的事件被触发后,该事件不会向父节点传递. 想要实时监听input的输入只要使用bindinput就可以了, wxml: <input bindinput='watchPassWord' type='password

实时监听input输入的变化(兼容主流浏览器)

遇到如此需求,首先想到的是change事件,但用过change的都知道只有在input失去焦点时才会触发,并不能满足实时监测的需求,比如监测用户输入字符数. 在经过查阅一番资料后,欣慰的发现firefox等现代浏览器的input有oninput这一属性,可以用三种方式使用它: 1,内嵌元素方式(属性编辑方式) <input id="test" oninput="console.log('input');" type="text" />

[转] 实时监听input输入的变化(兼容主流浏览器)

遇到如此需求,首先想到的是change事件,但用过change的都知道只有在input失去焦点时才会触发,并不能满足实时监测的需求,比如监测用户输入字符数. 在经过查阅一番资料后,欣慰的发现firefox等现代浏览器的input有oninput这一属性,可以用三种方式使用它: 1,内嵌元素方式(属性编辑方式) <input id="test" oninput="console.log('input');" type="text" />

实时监听input输入

oninput 是 HTML5 的标准事件,对于检测 textarea, input:text, input:password 和 input:search 这几个元素通过用户界面发生的内容变化非常有用,在内容修改后立即被触发,不像 onchange 事件需要失去焦点才触发.oninput 事件在主流浏览器的兼容情况如下: 从上面表格可以看出,oninput 事件在 IE9 以下版本不支持,需要使用 IE 特有的 onpropertychange 事件替代,这个事件在用户界面改变或者使用脚本直接

jQuery封装自定义事件--valuechange(动态的监听input,textarea)之前值,之后值的变化

jQuery封装自定义事件--valuechange(动态的监听input,textarea)之前值,之后值的变化 js监听输入框值的即时变化 网上有很多关于 onpropertychange.oninput的讲解,但是他们都不是我想要的,我想要的是动态的监听input,textarea等之前值和之后改变的值,比如像KISSY中的valuechange事件一样,当我在输入框里面开始输入1的时候,那么之前值是undefined,现在的值是1,当我接着输入2时候,那么之前的值是1,现在的值是2.等,

Jquery实时监听input value

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body id="lia-body"> <div class="lia-content"> <div class="

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

//jQuery实时监听input值变化 $("#email").on("input propertychange",function(){ var str = $(this).val(); console.log(str); //alert(str); });

js 实时监听input中值变化

js 实时监听input中值变化 分类: Javascript2014-05-11 11:13 849人阅读 评论(0) 收藏 举报 [html] view plaincopyprint? <!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8"> <title>RunJS