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

标签 javascript jquery

我正在为一个以 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/

相关文章:

javascript - 使用 Mongoose 获取新嵌入的文档

Javascript 在不应该的时候删除空格?

javascript - Backbone JS : Modify a single model from different views

javascript - Angular js 我无法动态调用我的按钮

Jquery html() 和 Internet Explorer 问题

javascript - $this->request->is ('ajax' ) 始终为 false

javascript - jquery - 单击更改按钮的文本仅在第二次单击时有效

javascript - jquery 动画每个列表项

javascript - 通过预定义的 HTML 页面列表进行下一个/上一个导航

javascript - 高度动画隐藏:Before Pseudo Element