背景:

在一次移动端H5开发中,需要监听输入框值的实时变动。

onchange事件肯定抛弃,因为只能失去焦点才触发。

keyPress在Android可以触发,iOS不可以。

又不想用Android和iOS都可以触发的keyDownkeyUp

于是,百度出了新东西:oninput!【需要配合propertychange,兼容 IE9 以下版本】

用法:

JS:

if(isIE)
{
  document.getElementById("input").onpropertychange = keys();
}
else
{
  document.getElementById("input").addEventListener("input", keys, false);
}

jQuery:

$('input').bind('input propertychange', function() {
  //进行相关操作
});

注意,下面的写法不支持:

//N/A!
$('input').input(function() {
  //进行相关操作
});

参考资料:js与jquery实时监听输入框值的oninput与onpropertychange方法

移动端用js与jquery实时监听输入框值的改动的更多相关文章

  1. js与jquery实时监听输入框值变化方法

    本文实例讲述了js与jquery实时监听输入框值的oninput与onpropertychange方法.分享给大家供大家参考.具体如下: 最近做过一个项目,需求是下拉框里自动匹配关键字,具体细节是实时 ...

  2. js与jquery实时监听输入框值的oninput与onpropertychange方法

    文实例讲述了js与jquery实时监听输入框值的oninput与onpropertychange方法.分享给大家供大家参考.具体如下: 最近做过一个项目,需求是下拉框里自动匹配关键字,具体细节是实时监 ...

  3. jquery实时监听输入框值变化

    在做web开发时候很多时候都需要即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感.而采用onchange时间又往往是在输入框失去焦点(onblur)时候触发,有时候并不能满足条 ...

  4. Js/jQuery实时监听输入框值变化

    前言 在做web开发时候很多时候都需要即时监听输入框值的变化,以便作出即时动作去引导浏览者增强网站的用户体验感.而采用onchange时间又往往是在输入框失去焦点(onblur)时候触发,有时候并不能 ...

  5. js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange

    (1)     先说jquery, 使用 jQuery 库的话,只需要同时绑定 oninput 和 onpropertychange 两个事件就可以了,示例代码: $('#username').bin ...

  6. jquery 实时监听输入框值变化的完美方案

    只需要同时绑定 oninput 和 onpropertychange 两个事件,但是这并不完美 $('.input-form :input').bind('input propertychange', ...

  7. jquery 实时监听输入框值变化方法

    $('.offers-number').bind('input propertychange', function (a, b) { var value = $(this).val() if (!va ...

  8. oninput和onpropertychange实时监听输入框值的变化

    oninput和onpropertychange实时监听输入框值的变化 传统监听输入框的做法就是使用keyup.keydown.keypress,或者change事件来实现,但keyup.keydow ...

  9. 实时监听输入框值变化的完美方案:oninput & onpropertychange

    实时监听输入框值变化的完美方案:oninput & onpropertychange: 网址:http://www.cnblogs.com/lhb25/archive/2012/11/30/o ...

随机推荐

  1. call和bind改变的上下文环境

    这周自我学习的时间很宽裕.正巧一直对call和apply不甚理解(虽然bind还经常用到,仅仅是知道这么用有这个效果= =,而不知为何有这个效果),下午就自己写写demo,帮助自己理解. functi ...

  2. java关于ArrayList中toArray方法的使用

    先来看下面这段程序 Collection collect= new ArrayList();   collect.add("小黑");   collect.add("小白 ...

  3. Excel数据导入数据库的SQL快速生成

    =CONCATENATE("insert into table_name(id, code, name, remark) values (uuid(),'",B2,"', ...

  4. WebClient 数据传输

    数据提交 post  ,get public string WebClientPost(string PostData, string PostUrl, string Type) { string p ...

  5. MyEclipse部署到tomcat的问题

    开发环境为MyEclipse2014,tomcat版本为8.0,部署tomcat时,出现以下问题: 这时,解决方法如下: 1.右击项目,选择export,弹出框后,在上方输入WAR file,下方会出 ...

  6. c# GridControl怎么换行

    百度找到的答案 1.ColumnEdit 增加 MemoEdit2.AppearanceCell-TextOptions- WordWrap3.OptionsView RowAutoHeight

  7. Chrome必备的扩展

    Devtools Terminal ——浏览器终端.牛逼的不得了! LiveReload——为官方 LiveReload 应用程序(Mac 和 Windows)和第三方,例如 guard-livere ...

  8. C语言中的栈和堆

    原文出处<http://blog.csdn.net/xiayufeng520/article/details/45956305#t0> 栈内存由编译器分配和释放,堆内存由程序分配和释放. ...

  9. ex3-数字和数字计算

    代码: print("I will now count my chickens:") print("hens", 25+30/6)print("Roo ...

  10. 使用java反射机制编写Student类并保存

    定义Student类 package org; public class Student { private String _name = null; ; ; public Student() { } ...