JQuery 启用和禁用滚动

Question

大家好，我遇到了 jQuery 代码的问题。实际上它工作正常但我无法在关闭 div.

后使用我的滚轮滚动

$(document).ready(function() {
    $("#add_item_inventory_toggle").click(function() {
        $("#add_item_inventory").fadeOut("fast");
        $("#add_item_inventory_toggle").hide();

        $('body').off('scroll mousewheel touchmove', function(e) {
            e.preventDefault();
            e.stopPropagation();
            return false;
        });
    });

    $("#inventory_content_add_items").click(function() {
        $("#add_item_inventory").fadeIn("fast");
        $("#add_item_inventory_toggle").show();

        $('body').on('scroll mousewheel touchmove', function(e) {
            e.preventDefault();
            e.stopPropagation();
            return false;
        });
    });
});

Answer 1

我认为你的问题是这样的：

$('body').off('scroll mousewheel touchmove', function(e) {
    e.preventDefault();
    e.stopPropagation();
    return false;
});

应该是：

$('body').off('scroll mousewheel touchmove');

当您将一个函数传递给 off 时，它会尝试找到该特定函数作为该元素上那些事件的处理程序。但是由于您在这两种情况下都传递了一个匿名函数，因此当使用 on 和 off 时，它们是该函数的两个新实例，即使它们都做同样的事情。所以它永远不会找到要删除的处理程序。在幕后的某个地方想象这两个函数在内存中都有一个独特的位置，它们没有指向同一个位置，因为它们是匿名的并且在两个区域中定义。通过不将函数传递给 off，它只会删除为这些事件附加到该元素的任何函数。

现在如果你这样做：

$(document).ready(function() {
    $("#add_item_inventory_toggle").click(function() {
        $("#add_item_inventory").fadeOut("fast");
        $("#add_item_inventory_toggle").hide();

        $('body').off('scroll mousewheel touchmove', stopScrolling);
    });

    $("#inventory_content_add_items").click(function() {
        $("#add_item_inventory").fadeIn("fast");
        $("#add_item_inventory_toggle").show();

        $('body').on('scroll mousewheel touchmove', stopScrolling);
    });
});

function stopScrolling (e) {
    e.preventDefault();
    e.stopPropagation();
    return false;
}

它会起作用，因为我们将相同的函数引用传递给 on 和 off。

Answer 2

发生这种情况是因为 e.preventDefault() 将阻止默认事件的发生，在您的情况下，滚动。

http://jsfiddle.net/DHz77/1/

回见。

JQuery 启用和禁用滚动

JQuery enable and disable scrolling

jquery

scroll

toggle