我正在为一个以 js 为主的 Web 应用程序实现一个交互式教程。我突出显示一些容器并希望用户单击其中的某些元素。同时,我想阻止用户做任何其他事情,例如单击不同的链接。
主要问题是我不想取消绑定(bind)任何事件 - 当教程关闭时,应用程序必须像以前一样工作。
我首先在容器的所有后代元素上注册一个处理程序:
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")
这可行,但非常重。我尝试仅在定义了一些自定义事件处理程序的元素上注册事件,但它忽略了 anchor 和其他基本元素。也许你能想出一些好主意?
最佳答案
我将获取事件父元素并将其传递给一个函数,该函数将禁用除父元素中的事件之外的所有事件
$('.className').live ('click', function (e)
{
if (!$(this).parents('#targetParent').length))
return false; // same as e.preventDefault() & e.stopPropogation()
});
希望这与您想要的类似
关于javascript - 禁用容器内元素的所有操作,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/12494861/