原生 绑定和解除绑定事件 & jquery事件重复绑定解决办法

原生 绑定和解除绑定事件

参考链接
https://www.cnblogs.com/jsdarkhorse/archive/2012/09/19/2693191.html

// 事件绑定
        this.bindHandler = (function() {
            if (window.addEventListener) {// 标准浏览器
                return function(elem, type, handler) {// elem:节点    type:事件类型   handler:事件处理程序
                    // 最后一个参数为true:在捕获阶段调用事件处理程序    为false:在冒泡阶段调用事件处理程序
                    elem.addEventListener(type, handler, false);
                }
            } else if (window.attachEvent) {// IE浏览器
                return function(elem, type, handler) {
                    elem.attachEvent("on" + type, handler);
                }
            }
        })();

        // 事件解除
        this.removeHandler = (function() {
            if (window.removeEventListerner) {// 标准浏览器
                return function(elem, type, handler) {
                    elem.removeEventListerner(type, handler, false);

                }
            } else if (window.detachEvent) {// IE浏览器
                return function(elem, type, handler) {
                    elem.detachEvent("on" + type, handler);
                }
            }
        })();

jquery事件重复绑定解决办法

参考大佬链接 全是干货:http://blog.csdn.net/qq_30114149/article/details/79413432

<!DOCTYPE html>  
<html>  
<head>  
    <title></title>  
</head>  
<body>  
    <button id="add-event-more">叠加绑定SayHello事件</button>  
    <button id="add-event-one">先移除再绑定SayHello事件</button>  
    <button id="say-hello">Say Hello</button>  
<script type="text/javascript" src="jquery-2.1.4.min.js"></script>  
<script type="text/javascript">  
    $(document).ready(function () {  
        var iCount = 0;  
        function sayHello() {  
            alert("Hello!");  
        }  
        //  每Click1次,多响应事件一次(叠加了)  
        $('#add-event-more').on('click', function () {  
            iCount = iCount + 1;  
            $("#say-hello").html("Say Hello" + iCount + "次");  
            $("#say-hello").on("click", sayHello);  //  绑定事件(事件叠加了)  
        });  
        //  永远只响应1次事件  
        $('#add-event-one').on("click", function () {  
            $('#say-hello').html("Say Hello 1次");  
            $("#say-hello").off('click').on('click', sayHello);  //  先移除事件(避免事件叠加),在绑定事件  
        })  
    })  
</script>  
</body>  
</html>  
  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值