情景:监听input输入框值的实时变化实例

解决方法:1.在元素上同时绑定oninput和onporpertychanger事件

实例:<script type="text/JavaScript">

  function watch(){

  consolo.log("in")

}

</script>

<input type="text"  oninput="watch(event)" onporpertychange="watch(event)" />

2.原生js

<script type="text/javascript">
 $(function(){
   if("\v"=="v"){//true为IE浏览器,感兴趣的同学可以去搜下,据说是现有最流行的判断浏览器的方法
    document.getElementById("a").attachEvent("onporpertychange",function(e){
    console.log("inputting!!");
    }
  }else{
    document.getElementById("a").addEventListener("onporpertychange",function(e){
    console.log("inputting!!");
    }
  }
});
</script>
<input type="text" id="a"/>
3.使用jQuery绑定事件
<script type="text/javascript">
 $(function(){
  $("#a").bind('input porpertychange',function(){
    console.log("e");
    });
  });
</script>
<input type="text" id="a"/>

js监听input输入框值的实时变化实例的更多相关文章

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

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

  2. 【链接】js监听input输入框内容变化

    https://blog.csdn.net/idomyway/article/details/79078625 $("#input1").bind("input prop ...

  3. 原生js监听input值改变事件

    哈哈哈,又来了,今天闲来无事,实验了下原生js监听input value值改变事件,下面就来说道说道: 本来写监听input值便获是用jquery的,之前的随笔写了,就是这个方法,地址:http:// ...

  4. js 实时监听input中值变化

    注意:用到了jquery需要引入jquery.min.js. 需求: 1.每个地方需要分别打分,总分为100; 2.第一个打分总分为40; 3.第二个打分总分为60. 注意:需要判断null.&quo ...

  5. js监听input等表单输入框的变化事件oninput

    js监听input等表单输入框的变化事件oninput,手机页面开发中使用到文本框textarea输入字符监听文本框变化计算还可以输入多少字符,如果使用onkeyup的话是无法监听到输入法输入的文本变 ...

  6. jQuery实时监听input的值变化(input的值产生变化才会触发事件)

    //用于监听input的值变化(input的值产生变化才会触发事件) (function ($) { $.fn.watch = function (callback) { return this.ea ...

  7. 监听HTML input输入框值的即时变化onpropertychange、oninput兼容IE,Chrome,FF,Opera等

    转自:http://blog.csdn.net/itchiang/article/details/7769337 要达到的效果 很多情况下我们都会即时监听输入框值的变化,以便作出即时动作去引导浏览者增 ...

  8. 原生js监听input值发生变化

    原生JS中可以使用oninput,onpropertychange,onchange oninput,onpropertychange,onchange的用法 1) onchange 触发事件必须满足 ...

  9. jq 实时监听input输入框的变化

    项目需求中有时候需要实时监测 input 的值变化,虽然 input 自身有 focus 和 blur 事件,但是有时候跟需求不符合. 所以实时监听 input 值变化的代码为: $("#i ...

随机推荐

  1. linux下简洁优化部署tomcat应用

    本文来自我的github pages博客http://galengao.github.io/ 即www.gaohuirong.cn 摘要: 本文是自己根据公司架构部署tomcat方法整理出来的文本 修 ...

  2. win7下通过easyBCD引导安装Ubuntu16.04(并处理遇到的坑)

    Ubuntu16.04作为目前最新版本的ubuntu系统,相信很多人都想在自己的电脑上安装一下,然而系统的安装方法各式各样,u盘法.grub引导法等等,这里我将介绍在win7系统下用easyBCD软件 ...

  3. java 堆和栈

    转载自 http://blog.csdn.net/peterwin1987/article/details/7571808 博主讲的相当清楚吼吼吼

  4. Ehcache入门基础

    1.ehcache的简介  EhCache 是一个纯Java的进程内缓存框架,具有快速.精干等特点,是Hibernate中默认的CacheProvider. 2.ehcache入门实例 1.首先先导入 ...

  5. Linux系统软件安装的几种方式

    Linux系统,一个文件能不能执行看的是有没有可执行权限x,不过真正的可执行文件是二进制文件(binary file),举例来说Linux上的c语言源码编写完后,通过gcc程序编译后就可以创建一个可执 ...

  6. Spring中的@scope注解

    默认是单例模式,即scope="singleton".另外scope还有prototype.request.session.global session作用域.scope=&quo ...

  7. Nginx和php是怎么通信的?

    先来看一下搭建好PHP运行环境的Nginx配置文件. 非常重要的就是 fastcgi_pass 指令了,这个指令用于指定 fpm 进程监听的地址,Nginx 会把所有的 php 请求翻译成 fastc ...

  8. windows 如何编译 Openssl ?

    windows 如何编译 Openssl ? 编译环境 VS2015 Openssl 1.0.2 ActivePerl 5.24.3 x64 编译步骤 安装 ActivePerl 期间,勾选添加至环境 ...

  9. mybatis与spring的整合(使用接口实现crud)

    本人刚刚接触mybatis,今天把它和spring整合起来用了一个上午==. 一开始是通过配置文件来配置,后来尝试用了一下注解,觉得mybatis的注解真的有点恶心...一大坨的,所以我还是建议使用配 ...

  10. springMVC,spring,mybatis全注解搭建框架--第一步,让框架跑起来

    自己从事java开发工作也有一年多了,自己却没有亲手搭建一个完整的框架.于是今天自己动手搭建一个,过程中遇到一些问题,倒腾了大半天终于搞定了. 现在给大家分享一下过程,自己也记录下来,以后学习参考使用 ...