jquery 实时监听输入框值变化的完美方法(必看)


Posted in Javascript onJanuary 26, 2017

只需要同时绑定 oninput 和 onpropertychange 两个事件,但是这并不完美

$('.input-form :input').bind('input propertychange', function()
{
  //获取.input-form下的所有 <input> 元素,并实时监听用户输入
  //逻辑
})

jquery 实时监听输入框值变化的完美方法(必看)

以上代码在因为用的bind,所以当遇到追加的新input标签时,则不能监听了。

如下情景:

由上图可以看到189和135号码是可以监听的,但是新追加的178和188则无效。

怎么解决这个问题呢?

整了大半天,好吧,用live代替bind即可

$('.input-form :input').live('input propertychange', function()
{
  //获取.input-form下的所有 <input> 元素,并实时监听用户输入
  //逻辑
})

以上这篇jquery 实时监听输入框值变化的完美方法(必看)就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在网页中屏蔽快捷键
Sep 06 Javascript
jQuery 前的按键判断代码
Mar 19 Javascript
关于JavaScript中的关联数组分析
Apr 09 Javascript
display和visibility的区别示例介绍
Feb 26 Javascript
使用jquery+CSS实现控制打印样式
Dec 31 Javascript
jQuery入门基础知识学习指南
Aug 14 Javascript
ztree获取选中节点时不能进入可视区域出现BUG如何解决
Dec 03 Javascript
详解javascript跨浏览器事件处理程序
Mar 27 Javascript
JavaScript基础语法之js表达式
Jun 07 Javascript
微信小程序实现全局搜索代码高亮的示例
Mar 30 Javascript
JavaScript如何对图片进行黑白化
Apr 10 Javascript
Vue项目打包编译优化方案
Sep 16 Javascript
Jquery实时监听input value的实例
Jan 26 #Javascript
jquery实时获取时间的简单实例
Jan 26 #Javascript
微信小程序实现图片自适应(支持多图)
Jan 25 #Javascript
js遮罩效果制作弹出注册界面效果
Jan 25 #Javascript
assert()函数用法总结(推荐)
Jan 25 #Javascript
canvas知识总结
Jan 25 #Javascript
基于JavaScript实现自定义滚动条
Jan 25 #Javascript
You might like
全国FM电台频率大全 - 23 四川省
2020/03/11 无线电
php注入实例
2006/10/09 PHP
php数据库连接时容易出错的特殊符号问题
2010/09/01 PHP
Discuz7.2版的faq.php SQL注入漏洞分析
2014/08/06 PHP
PHP浮点比较大小的方法
2016/02/14 PHP
PHP strip_tags保留多个HTML标签的方法
2016/05/22 PHP
PHP获取当前执行php文件名的代码
2017/03/02 PHP
5个最佳的Javascript日期处理类库分享
2012/04/15 Javascript
js Dialog 实践分享
2012/10/22 Javascript
一个可拖拽列宽表格实例演示
2012/11/26 Javascript
js 鼠标移动显示图片的简单实例
2013/12/25 Javascript
jquery自定义滚动条插件示例分享
2014/02/21 Javascript
一个判断抢购时间是否到达的简单的js函数
2014/06/23 Javascript
javascript中字符串拼接详解
2014/09/26 Javascript
两种方法基于jQuery实现IE浏览器兼容placeholder效果
2014/10/14 Javascript
JavaScript实现鼠标滑过处生成气泡的方法
2015/05/16 Javascript
基于jquery实现省市联动特效
2015/12/17 Javascript
原生js和jQuery实现淡入淡出轮播效果
2015/12/25 Javascript
jQuery中animate()的使用方法及解决$(”body“).animate({“scrollTop”:top})不被Firefox支持的问题
2017/04/04 jQuery
详解如何用webpack打包一个网站应用项目
2017/07/12 Javascript
JavaScript模拟文件拖选框样式v1.0的实例
2017/08/04 Javascript
JavaScript实现仿Clock ISO时钟
2018/06/29 Javascript
JS实现普通轮播图特效
2020/01/01 Javascript
JS数组的高级使用方法示例小结
2020/03/14 Javascript
[02:43]2018DOTA2亚洲邀请赛主赛事首日TOP5
2018/04/04 DOTA
Python中的ctime()方法使用教程
2015/05/22 Python
windows下 兼容Python2和Python3的解决方法
2018/12/05 Python
详解pandas数据合并与重塑(pd.concat篇)
2019/07/09 Python
浅析python实现动态规划背包问题
2020/12/31 Python
AmazeUI底部导航栏与分享按钮的示例代码
2020/08/18 HTML / CSS
美国最大的网络男装服装品牌:Bonobos
2017/05/25 全球购物
新年主持词
2014/03/27 职场文书
优秀员工事迹材料
2014/12/20 职场文书
治理商业贿赂工作总结
2015/08/10 职场文书
2019年幼儿园家长接送责任书
2019/10/29 职场文书
微信小程序中wxs文件的一些妙用分享
2022/02/18 Javascript