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 相关文章推荐
Firefox下无法正常显示年份的解决方法
Sep 04 Javascript
js动态切换图片的方法
Jan 20 Javascript
IE8下jQuery改变png图片透明度时出现的黑边
Aug 30 Javascript
JQuery实现左右滚动菜单特效
Sep 28 Javascript
javascript 初学教程及五子棋小程序的简单实现
Jul 04 Javascript
Vue 中使用vue2-highcharts实现top功能的示例
Mar 05 Javascript
echarts设置图例颜色和地图底色的方法实例
Aug 01 Javascript
JavaScript引用类型RegExp基本用法详解
Aug 09 Javascript
angular 用Observable实现异步调用的方法
Dec 27 Javascript
浅谈vue中$bus的使用和涉及到的问题
Jul 28 Javascript
vue中选中多个选项并且改变选中的样式的实例代码
Sep 16 Javascript
一百多行代码实现react拖拽hooks
Mar 23 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
?算你??的 PHP 程式大小
2006/12/06 PHP
phpmyadmin安装时提示:Warning: require_once(./libraries/common.inc.php)错误解决办法
2011/08/18 PHP
PHP入门教程之自定义函数用法详解(创建,调用,变量,参数,返回值等)
2016/09/11 PHP
PHP+RabbitMQ实现消息队列的完整代码
2019/03/20 PHP
在Laravel 中实现是否关注的示例
2019/10/22 PHP
原生JS实现表单checkbook获取已选择的值
2013/07/21 Javascript
js获取某元素的class里面的css属性值代码
2014/01/16 Javascript
javascript+html5实现仿flash滚动播放图片的方法
2015/04/27 Javascript
jquery实现的Banner广告收缩效果代码
2015/09/02 Javascript
jquery ajax双击div可直接修改div中的内容
2016/03/04 Javascript
vue.js之vue-cli脚手架的搭建详解
2017/05/05 Javascript
微信小程序实现动态设置页面标题的方法【附源码下载】
2017/11/29 Javascript
Vue 项目部署到服务器的问题解决方法
2017/12/05 Javascript
JavaScript实现封闭区域布尔运算的示例代码
2018/06/25 Javascript
彻底弄懂 JavaScript 执行机制
2018/10/23 Javascript
vue+element+Java实现批量删除功能
2019/04/08 Javascript
JS原形与原型链深入详解
2020/05/09 Javascript
Vue elementui字体图标显示问题解决方案
2020/08/18 Javascript
vue-cli3中配置alias和打包加hash值操作
2020/09/04 Javascript
Python中文字符串截取问题
2015/06/15 Python
RC4文件加密的python实现方法
2015/06/30 Python
在Apache服务器上同时运行多个Django程序的方法
2015/07/22 Python
python if not in 多条件判断代码
2016/09/21 Python
python3+PyQt5使用数据库窗口视图
2018/04/24 Python
python之pexpect实现自动交互的例子
2019/07/25 Python
使用wxpy实现自动发送微信消息功能
2020/02/28 Python
获取python运行输出的数据并解析存为dataFrame实例
2020/07/07 Python
python 使用建议与技巧分享(四)
2020/08/18 Python
详解Python中的编码问题(encoding与decode、str与bytes)
2020/09/30 Python
利用python清除移动硬盘中的临时文件
2020/10/28 Python
GAP美国官网:美国休闲时尚品牌
2016/08/26 全球购物
安全大检查反思材料
2014/01/31 职场文书
监察建议书格式
2014/05/19 职场文书
“向国旗敬礼”活动策划方案(4篇)
2014/09/27 职场文书
SpringBoot2 参数管理实践之入参出参与校验的方式
2021/06/16 Java/Android
关于对TypeScript泛型参数的默认值理解
2022/07/15 Javascript