jquery多种方式实现输入框input输入时的onput,onpropertychange,onchange触发事件及区别
有关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触发事件及区别的更多相关文章
- jQuery实时监听input的值变化(input的值产生变化才会触发事件)
//用于监听input的值变化(input的值产生变化才会触发事件) (function ($) { $.fn.watch = function (callback) { return this.ea ...
- html5与js关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的value点击全选状态onclick="select();"。做购物车页面时会要用到。
关于input[type='text']文本框value改变触发事件一些属性的区别oninput,onpropertychange,onchange和文本框的点击全选状态onclick="s ...
- js/jquery 实时监听输入框值变化的完美方案:oninput & onpropertychange
(1) 先说jquery, 使用 jQuery 库的话,只需要同时绑定 oninput 和 onpropertychange 两个事件就可以了,示例代码: $('#username').bin ...
- Jquery选择器大全、属性操作、css操作、文档、事件等
一.简介 定义 jQuery创始人是美国John Resig,是优秀的Javascript框架: jQuery是一个轻量级.快速简洁的javaScript库. jQuery对象 jQuery产 ...
- js和jquery中的触发事件
改别人的坑,遇到jquery选择器和fireEvent混用,不认识fireEvent方法报错. js的方法不能使用jquery的选择器去调用. 1.fireEvent (IE上的js方法 ) 我们来看 ...
- 监听输入框变化(oninput,onpropertychange,onchange)
oninput,onpropertychange,onchange: oninput是onpropertychange的非IE浏览器版本,支持firefox和opera等浏览器,但有一点不同,它绑定于 ...
- jQuery绑定事件-多种方式实现
jQuery绑定事件-多种方式实现: <html> <head> <meta charset="utf-8" /> <script src ...
- Jquery Validate 表单验证的多种方式
ASP.NET MVC Jquery Validate 表单验证的多种方式 在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体 ...
- ASP.NET MVC Jquery Validate 表单验证的多种方式
在我们日常开发过程中,前端的表单验证很重要,如果这块处理不当,会出现很多bug .但是如果处理的好,不仅bug会很少,用户体验也会得到很大的提升.在开发过程中我们可以不借助 JS 库,自己去手写 JS ...
随机推荐
- 上传文件没有写权限Access to the path is denied
Access to the path is denied. asp.net程序目录放在系统盘,ntfs格式. 程序中对cfg.xml有写入操作. 运行的时候出现了这个问题. 在我自己的机器上没有问题 ...
- YYHS-Super Big Stupid Cross(二分+扫描线+平衡树)
题目描述 “我是超级大沙茶”——Mato_No1 为了证明自己是一个超级大沙茶,Mato 神犇决定展示自己对叉(十字型)有多么的了 解. Mato 神犇有一个平面直角坐标系,上面有一些线段,保证这些线 ...
- FPGA在其他领域的应用(三)
广播领域: 专业的A/V(音频/视频),和演播室行业正在经历着激动人心的变化,例如,UHD/8K (超高清)视频.多平台内容交付.IP网络传输和云计算.2016里约奥运会使用4K分辨率视频播放,而日本 ...
- Oracle之 any 、some、all解析
oracle之 any.some.all 解析 因为很少用到, 所以几乎忘记了这几个函数, 不过它们还是很有用的使用它们可以大大简化一些SQL文的语法, 至于效率问题, 如CCW所说它们和EXISTS ...
- 项目收集-AutoMapper使用,事务,Json.Net序列化反序列化,代码生成调用等
using System; using AutoMapper; using Newtonsoft.Json; using Newtonsoft.Json.Linq; namespace Console ...
- 项目常用Javascript分享,包含常用验证和Cookie操作
function IsEmail(str) { var r = /^[a-zA-Z0-9._%-]+@[a-zA-Z0-9.-]+\.[a-zA-Z]{2,4}$/; if (r.test(str)) ...
- PPT排版细节,写给大家看的设计书,完美总结
原创作者:陈玓玏 相信每一位小宝贝在工作中都会被老板用PPT虐无数遍,虐到自己怀疑人生.奈何在网上随手一搜,出现的各类招聘要求都躲不开"熟练掌握PPT制作",尤其是各类科技公司.咨 ...
- 【转载】jQuery动画中的queue()函数
原文链接:http://www.cnblogs.com/hh54188/archive/2011/04/09/1996469.html 原文摘要:当你使用一系列的动画效果(如hide,show),这些 ...
- PHP Server Nginx 安装
1. PHP 安装: http://jingyan.baidu.com/article/b2c186c8f16d05c46ef6ff3c.html PHP 问题: http://www.cnblogs ...
- memset和fill_n区别
1. 函数名: memset 所属头文件:<string.h> 用法:void *memset(void *s, char ch, unsigned n); 对于对int之类的数组,只能用 ...