关闭

input等表单项值或属性发生变化时的事件监听

标签: js事件监听
221人阅读 评论(0) 收藏 举报
分类:

HTML5增加了个事件oninput,这个监听包括:输入时、点击文本框下拉提示输入时、右键的复制、剪贴和粘贴,但由于IE9以下不支持oninput,所以加一个onpropertychange事件监听可完美解决。

$(function(){
    //监听手机号码输入
    $("#mobile").on("input propertychange", function() {
         //todo
    });

参考:http://www.cnblogs.com/lhb25/archive/2012/11/30/oninput-and-onpropertychange-event-for-input.html


但请教了一位前端大牛,话说是oninput兼容性比较差,propertychange这个监听影响性能。

于是有了下面这个折中的办法:

$(function(){
    $.fn.pasteEvents = function(delay){
        if (delay == undefined) delay = 20;
        return $(this).each(function(){
            var $el = $(this);
            $el.on("paste", function(){
                $el.trigger("prepaste");
                setTimeout(function(){$el.trigger("postpaste");}, delay);
            });
        });
    };

    //监听手机号码输入
    $("#mobile").on("input keyup postpaste", function() {
         //todo
    });

补充说明:

在实际使用过程中,input、keyup、postpaste对这些事件的监听,会出现冒泡从而多次回调,还是以监听input、propertychange为比较稳定的用法。


0
0

猜你在找
【套餐】Hadoop生态系统零基础入门
【套餐】嵌入式Linux C编程基础
【套餐】2017软考系统集成项目——任铄
【套餐】Android 5.x顶级视频课程——李宁
【套餐】深度学习入门视频课程——唐宇迪
【直播】广义线性模型及其应用——李科
【直播】从0到1 区块链的概念到实践
【直播】计算机视觉原理及实战——屈教授
【直播】机器学习之凸优化——马博士
【直播】机器学习&数据挖掘7周实训--韦玮
查看评论
* 以上用户言论只代表其个人观点,不代表CSDN网站的观点或立场
    个人资料
    • 访问:40436次
    • 积分:1479
    • 等级:
    • 排名:千里之外
    • 原创:107篇
    • 转载:53篇
    • 译文:0篇
    • 评论:0条
    文章分类