Question

我正在为一个js-heavy web应用程序实现一个交互式教程。我突出显示了一些容器，并期望用户点击其中的一些元素。同时，我想阻止用户做任何其他事情，例如点击其他链接。

主要问题是我不想取消绑定任何事件 - 当教程关闭时，应用程序必须像以前一样工作。

我开始在所有containter的后代元素上注册一个处理程序：

element.on("click.tutorialLock", function(e){
    e.stopPropagation();
    e.stopImmediatePropagation();
    e.preventDefault();
}

然后我设置它的“优先级”，以便它在任何其他事件之前执行：

handlers = element.data("events").click;
our = handlers.pop();
handlers.splice(0, 0, our);

最后，当我想解锁一些元素时，我只是禁用它上面的事件：

elementToEnable.off(".tutorialLock")

有效，但非常沉重。我尝试仅在已定义一些自定义事件处理程序的元素上注册事件，但它省略了锚点和其他基本元素。也许你能想出一些好主意？

Answer 1

我会得到活动的父元素并将其传递给一个函数，该函数将禁用除父级事件之外的所有事件

$('.className').live ('click', function (e)
{
if (!$(this).parents('#targetParent').length))
    return false; // same as e.preventDefault() & e.stopPropogation()
});

希望这与你想要的相似

禁用容器内元素的所有操作

1 个答案: