有关inputs输入内容的事件监听,一般我们会想到下面几个关键词:onput,onpropertychange,onchange

onput与onchange的一个区分

onput:该事件在 <input> 或 <textarea> 元素的值发生改变时触发(立即触发);

onchange:该事件在在 <input> ,<textarea>, <keygen> 和 <select>  元素失去焦点触发;

如下测试实例:

onchange和onput都输入结束后的效果:

当onchange和onput都输入结束后的点击页面失去焦点后的效果:

一般js中使用方式:object.oninput/onchange=function(){

      //触发实现的功能代码

      ...........

    };

onpropertychange:在触发对象改变任何属性时都会触发;这个是IE专属的,其他浏览器不兼容

不过我们可以这样来使用兼容其他的浏览器

$('.proitem input').bind('input propertychange', function() {

$(this).css("box-shadow","none");

});

就是每次输入内容都会触发使得其中的阴影效果消失。

jquery多种方式实现输入框input输入时的onput,onpropertychange,onchange触发事件及区别的更多相关文章

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

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

  2. html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。

    关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="s ...

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

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

  4. Jquery选择器大全、属性操作、css操作、文档、事件等

    一.简介   定义  jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库. jQuery对象  jQuery产 ...

  5. js和jquery中的触发事件

    改别人的坑,遇到jquery选择器和fireEvent混用,不认识fireEvent方法报错. js的方法不能使用jquery的选择器去调用. 1.fireEvent (IE上的js方法 ) 我们来看 ...

  6. 监听输入框变化(oninput,onpropertychange,onchange)

    oninput,onpropertychange,onchange: oninput是onpropertychange的非IE浏览器版本,支持firefox和opera等浏览器,但有一点不同,它绑定于 ...

  7. jQuery绑定事件-多种方式实现

    jQuery绑定事件-多种方式实现: <html> <head> <meta charset="utf-8" /> <script src ...

  8. Jquery Validate 表单验证的多种方式

    ASP.NET MVC Jquery Validate 表单验证的多种方式 在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体 ...

  9. ASP.NET MVC Jquery Validate 表单验证的多种方式

    在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...

随机推荐

  1. ssh项目访问路径及url请求书写

    在ssh项目中配置好Struts后,一般可以采用两种方式进行后台请求: 1.html形式,包括a标签,form表单,ajax等.此时的访问链接必须写全路径,可以是相对路径,也可以是绝对路径 相对路径方 ...

  2. 使用SQLite做本地数据缓存的思考

    前言 在一个分布式缓存遍地都是的环境下,还讲本地缓存,感觉有点out了啊!可能大家看到标题,就没有想继续看下去的欲望了吧.但是,本地缓存的重要性也是有的! 本地缓存相比分布式缓存确实是比较out和比较 ...

  3. @htmlhepler dropdownlistfor 报错

    说系统的字段不匹配. 是因为ViewData,没有赋值.

  4. 【NOIP】OpenJudge - 15-02:财务管理

    #include<stdio.h>//财务管理 int main() { ]={},sum=,ave=; ;i<=;i++) { scanf("%f",& ...

  5. 将本地代码上传到github

    准备工作上传本地代码到github 准备工作 在github上创建自己的Repository. 安装git,centos的git安装教程. 上传本地代码到github git init git add ...

  6. Message Queuing(MSMQ)

    一.前言 MicroSoft Message Queuing(微软消息队列)是在多个不同的应用之间实现相互通信的一种异步传输模式,相互通信的应用可以分布于同一台机器上,也可以分布于相连的网络空间中的任 ...

  7. 使用jquery-qrcode在页面上生成二维码,支持中文

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. ajax和jsonp使用总结

    前言:ajax和jsonp可以与后台通信,获取数据和信息,但是又不用刷新整个页面,实现页面的局部刷新. 一.ajax 定义:一种发送http请求与后台进行异步通讯的技术. 原理:实例化xmlhttp对 ...

  9. Java中public,protected,default,private的访问权限问题(简明扼要)

    import packa.*;//导入了packa包中所有的类.(不包括包中的子包)一般不会用,用哪个导入哪个. 导包的原则:用到哪个类,就导入哪个类.所有字母都小写. 权限列表:   public ...

  10. 在项目中集成jetty server

    为什么使用jetty 使用 tomcat 开发效率并不是太高,并且在eclipse有时两秒做更新,有时候又得手动去部署显得非常麻烦.折算我们可以使用 jetty server 由于 eclipse开发 ...