实时监听input输入框value的变化:
HTML5 标准事件 oninput 和 IE 专属事件 onpropertychange 事件实时监听输入框value的变化
oninput 事件在用户输入时触发。
该事件在 <input> 或 <textarea> 元素的值发生改变时触发。
提示: 该事件类似于 onchange 事件。不同之处在于 oninput 事件在元素值发生变化是立即触发, onchange 在元素失去焦点时才会触发。另外一点不同是 onchange 事件也可以作用于 <keygen> 和 <select> 元素。
oninput 支持的HTML标签:
<input type="password">
<input type="search">
<input type="text">
<textarea>
浏览器支持:
| Chrome | fireFox | Safari | IE | Opera |
| Yes | 4.0+ | 5.0+ | 9.0+ | Yes |
示例:
HTML:
<input type="text" oninput="onInput()"> JavaScript:
<script type="text/javascript">
function onInput() {
console.log("正在输入...");
}
</script> 或 HTML:
<input type="text"> JavaScript:
<script type="text/javascript">
var oInput = document.querySelector("input");
oInput.oninput = function () {
console.log("正在输入...");
};
</script> 或 HTML:
<input type="text"> JavaScript:
<script type="text/javascript" src="jquery.min.js"></script>
<script type="text/javascript">
$("input").on("input", function () {
console.log("正在输入...");
});
</script> 或 <script type="text/javascript">
// 同时绑定 input propertychange
$('input').bind('input propertychange', function() {
console.log("正在输入...");
});
</script>
实时监听input输入框value的变化:的更多相关文章
- jq 实时监听input输入框的变化
项目需求中有时候需要实时监测 input 的值变化,虽然 input 自身有 focus 和 blur 事件,但是有时候跟需求不符合. 所以实时监听 input 值变化的代码为: $("#i ...
- Js/jQuery实时监听input输入框值变化
前言在做web开发时候很多时候都需要即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感.而采用onchange时间又往往是在输入框失去焦点(onblur)时候触发,有时候并不能满 ...
- 实时监听input输入框value值的变化
1.js 的 oninput & onpropertychange JS中的 oninput 事件在 IE9 以下版本不支持,需要使用 IE 特有的 onpropertychange 事件替代 ...
- js实时监听input中值的变化
$(function(){ $('#inputid').bind('input propertychange', function() { // input 中的值 var params = $(th ...
- 实时监听input输入内容的N种方法
现在有一个需求,需要我们实时监听input输入框中的内容,从而带来更好的用户体验,而不是等我们全部输入完毕才告诉我们格式不对首先我们创建一个input输入框 <form name='loginF ...
- js监听input输入框值的实时变化实例
情景:监听input输入框值的实时变化实例 解决方法:1.在元素上同时绑定oninput和onporpertychanger事件 实例:<script type="text/JavaS ...
- js 实时监听input中值变化
注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...
- 使用jQuery实时监听input输入值的变化
//jQuery实时监听input值变化 $("#email").on("input propertychange",function(){ var str = ...
- 实时监听input输入的变化(兼容主流浏览器)【转】
遇到如此需求,首先想到的是change事件,但用过change的都知道只有在input失去焦点时才会触发,并不能满足实时监测的需求,比如监测用户输入字符数. 在经过查阅一番资料后,欣慰的发现firef ...
随机推荐
- Python杂记
一.函数 1.numpy 模块中的nonzero函数 nonzero返回的数非零元素的下标. 如果输入是单维度的时候它的返回值只有一个:如果输入是多个维度的话,那么它的返回值也是多个维度的.并且的它的 ...
- C语言出来多久了你知道吗?
在20世纪80年代,为了避免不同开发者使用的C语言语法的差异,美国国家标准局为C语言开发了一套完整的美国国家标准语言文法,称为ANSI C,作为C语言的初始标准.. [1] 2011年12月8日,国际 ...
- MySQL数据库主从分离的配置方法
1.介绍 MySQL数据库设置读写分离,可以使对数据库的写操作和读操作在不同服务器上执行,提高并发量和响应速度.现在的网站一般大点的,都采用有数据库主从分离.读写分离,既起到备份作用也可以减轻数据库的 ...
- 运用jieba库分词
代码: 统计出团队中文简介中词频 import jieba txt=open("C:\\Users\\Administrator\\Desktop\\介绍.txt","r ...
- 洛谷 P1879 解题报告
P1879 [USACO06NOV]玉米田Corn Fields 题目描述 农场主\(John\)新买了一块长方形的新牧场,这块牧场被划分成\(M\)行\(N\)列\((1 ≤ M ≤ 12; 1 ≤ ...
- JavaScript 字符串反转
第一种方法:使用内置方法 split()方法将一个字符串对象的每个字符拆出来,并且将每个字符串当成数组的每个元素 reverse()方法用来改变数组,将数组中的元素倒个序排列,第一个数组元素成为最后一 ...
- DX11 Without DirectX SDK--01 DirectX11初始化
回到 DirectX11--使用Windows SDK来进行开发 由于个人觉得龙书里面第4章提供的Direct3D 初始化项目封装得比较好,而且DirectX SDK Samples里面的初始化程序过 ...
- 敏捷(Agile)——“说三道四”
可以这么理解:一种以人为本.团队合作.快速响应变化和可工作的软件作为宗旨的开发方法.亦可理解为在一个高度协作的环境中,不断地使用反馈进行自我调整和完善,持续交付用户想要的软件的过程.敏捷开发提倡通过多 ...
- NS3系列——eclipse + NS3环境搭建
1. 安装NS3 (1)在 ubuntu12.04 中安装 ns3.20,首先要安装一下各种依赖软件: sudo apt-get install gcc g++ pythonsudo apt-get ...
- meta 元标签的常用用法
< meta > 元素 概要 标签提供关于HTML文档的元数据.元数据不会显示在页面上,但是对于机器是可读的.它可用于浏览器(如何显示内容或重新加载页面),搜索引擎(关键词),或其他 we ...