js点击事件多次触发问题

今天遇到了又一个神奇的问题,起因是做一个开启禁用功能的按钮,先给按钮定义事件。

$('.pro_on').click(project.proTurnOff);
$('.pro_off').click(project.proTurnOn);

在这开启事件函数中这样写,禁用事件同理。

//开启按钮事件
Project.prototype.proTurnOn = function(){
    pro_id = $(this).attr('id');
    var This = $(this);
    $.ajax({
        url:'/project_user/'+pro_id+'/edit',
        type:'get',
        data:{
            disable:0
        },
        beforeSend:function(){
            $('.loading').show();
        },
        success:function(data){

            if(data.status==200){
                This.html('禁用');
                This.removeClass('pro_off').addClass('pro_on');
                alert('修改为开启');
                $('.pro_on').click(project.proTurnOff);
                $('.pro_off').click(project.proTurnOn);
            }
        }
    })
};

这里需要注意,修改class之后,前面定义的事件失效了,需要重新定义才生效。但是这个时候,神奇的事情发生了,点击前几次的时候,开启禁用功能都正常,但是当从第四次点击开始,每点击一次,就相当于点击了n+1次,时间触发的次数越来越多,后经大师(兄弟会--王飞龙)指点,需要在重新定义点击时间之前,先取消之前的事件绑定。因此,修改如下

$('.pro_on').click(project.proTurnOff);           
$('.pro_off').click(project.proTurnOn);

修改为:

$('.pro_on').off("click").click(project.proTurnOff);
$('.pro_off').off("click").click(project.proTurnOn);

像往常一下,不知道为什么,但是,解决了。

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • Android 自定义View的各种姿势1 Activity的显示之ViewRootImpl详解 Activity...
    passiontim阅读 175,046评论 25 709
  • 2017.02.22 可以练习,每当这个时候,脑袋就犯困,我这脑袋真是神奇呀,一说让你做事情,你就犯困,你可不要太...
    Carden阅读 5,189评论 0 1
  • 发现 关注 消息 iOS 第三方库、插件、知名博客总结 作者大灰狼的小绵羊哥哥关注 2017.06.26 09:4...
    肇东周阅读 14,194评论 4 61
  • 最近的工作可以让我有相对比较大段的时间专注于做一件事。对于进入一个新的领域,接触一份新的工作,我还是记得曾有前辈给...
    何言阅色阅读 3,907评论 0 1
  • 零点刚过,小A抱着手机,开始了打卡,为了怕忘记,她逐一的签到,再签到。 签完到,她内心坦然了些,仿佛又完成了许多任...
    妞妞飞阅读 3,610评论 0 0