Question

有两个js脚本绑定到$(window).scroll()。在一个脚本（example1.js）中，我需要在满足某些条件时解除绑定事件（或找到可接受的替代方案），但这会导致.scroll()事件完全解除绑定，从而删除所有功能。

我想要做的是，一旦满足条件，就停止滚动事件为example1.js而不是example2.js。

example1.js

function exampleFunction(self) {
    $(window).scroll(function () {
        if ($(window).scrollTop() >= $(document).height() - $(window).height() - 364) {
            self.start();
        }
    });

    $.ajax({
        url: self.settings.dataUrl,
        dataType: "json",
        async: false,
        cache: false,
        success: function (json) {
            if (json.data.length) {
                self.json = json;
                self.addImages();
            } else {
                $(window).unbind('scroll');
            }
        }
    });
}

example2.js

$(window).scroll(function () {
    someFunction();
});

Answer 1

看看Namespaced Events。这将允许您命名一个事件，然后只取消绑定该命名空间，保持其他绑定不变。

例如：

// Create Bindings //
$(window).bind('scroll.example1', function(e){
    ...
});

$(window).bind('scroll.example2', function(e){
    ...
});

// Unbind ONLY .example1 Namespace //
$(window).unbind('scroll.example1');

我希望这有帮助！

Answer 2

绑定事件时使用namespaced事件。

示例：

//bind click.a $('.class').on('click.a', function(){ alert ('inside a space'); }); //bind click.b $('.class').on('click.b', function(){ alert ('inside b space'); }); //unbind click.b $('.class').off('click.b'); //trigger click.a $('.class').trigger('click.a');

在你的情况下，

<强> example1.js

function exampleFunction(self) { $(window).on('scroll.e1', function () { //bind scroll.e1 if ($(window).scrollTop() >= $(document).height() - $(window).height() - 364) { self.start(); } }); $.ajax({ url: self.settings.dataUrl, dataType: "json", async: false, cache: false, success: function (json) { if (json.data.length) { self.json = json; self.addImages(); } else { $(window).unbind('scroll.e1'); //unbind scroll.e1 } } }); }

<强> example2.js

$(window).on('scroll.e2', function () { //bind scroll.e2 someFunction(); });

已绑定多次的绑定事件

2 个答案: