Jquery实时监听input value的实例
2017-01-26 11:07
579 查看
实例如下:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Document</title> </head> <body id="lia-body"> <div class="lia-content"> <div class="inputwrapper"> <label><span>姓名:</span><input type="text" name="fullname"></label> <div class="result"></div> </div> </div> <script src="http://apps.bdimg.com/libs/jquery/1.11.3/jquery.min.js"></script> <script> $(function(){ var $inputwrapper = $('#lia-body .lia-content .inputwrapper'); $inputwrapper.find('input').on('input propertychange',function(){ var result = $(this).val(); console.log(result); $inputwrapper.find('.result').html(result); }); }) </script> </body> </html>
onchange触发事件必须满足两个条件:
1)当前对象属性改变,并且是由键盘或鼠标事件激发的(脚本触发无效)
2)当前对象失去焦点(onblur);
onpropertychange
只要当前对象属性发生改变,都会触发事件,但是它是IE专属的;
oninput是onpropertychange的非IE版本,支持firefox和opera等浏览器
但不同的是,它绑定于对象时,并非该对象所有属性改变都能触发事件,只有在对象的value值发生改变时才会生效。
这里我们用来监听input value的改变再好不过了。
以上这篇Jquery实时监听input value的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持脚本之家。
您可能感兴趣的文章:
相关文章推荐
- GUI 中监听 文本框实时改变的实例
- JQUERY实时监听input值变化
- jQuery绑定事件监听bind和移除事件监听unbind用法实例详解
- Android网络状态实时监听实例代码(二)
- Android 网络状态实时监听代码实例(一)
- JQuery 实时监听input输入框的值
- 移动端用js与jquery实时监听输入框值的改动
- jquery+ajax实现注册实时验证实例详解
- jquery实时监听某输入框值的变化
- js与jquery实时监听输入框值的oninput与onpropertychange方法
- js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange
- jquery学习--实时监听input
- js/jquery 实时监听输入框值:oninput & onpropertychange
- jquery+ajax实现注册实时验证实例详解
- js与jquery实时监听输入框值的oninput与onpropertychange方法
- GUI 中监听文本框实时改变的实例
- jQuery实现实时监听功能,并可以在指定的条件下关闭次监听
- s/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange
- (一)js/jquery实时监听输…
- js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange