zoukankan      html  css  js  c++  java
  • jquery事件重复绑定

    本文实例分析了jQuery防止重复绑定事件的解决方法。分享给大家供大家参考,具体如下:

    一、问题:

    今天发现jQuery一个对象的事件可以重复绑定多次,当事件触发的时候会引起代码多遍执行。

    下面是一个click事件被重复绑定的示例:

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    function reg_button_click(){
      $("#button).click(function(){
        alert("button click");
      });
    }
    $(document).ready(function(){
      #重复注册3次
      reg_button_click();
      reg_button_click();
      reg_button_click();
      #触发的时候 出现3个alert
      $('#button').click();
    });

    二、解决方法:

    对于需要重复绑定的场景,再事件注册时候考虑用先unbind 再bind的方法;或者先off 再on

    1
    2
    3
    4
    5
    6
    7
    8
    9
    10
    11
    12
    13
    function reg_button_click(){
      $("#button).unbind('click').bind('click',(function(){
        alert("button click");
      });
    }
    $(document).ready(function(){
      #重复注册3次
      reg_button_click();
      reg_button_click();
      reg_button_click();
      #触发的时候 出现3个alert
      $('#button').click();
    });
  • 相关阅读:
    左边菜单导航
    css3实现轮播
    js-统计选项个数
    空间评论。回复。点赞功能
    简单的购物车功能
    字符串常用的几种方法
    React,js实现分页的案列
    python2的cgi程序
    开发环境和工具
    github入门
  • 原文地址:https://www.cnblogs.com/youxin/p/6359677.html
Copyright © 2011-2022 走看看