Javascript 禁用OnClick事件，直到首先触发另一个事件

我有6个div（

.selector

）要执行（

onclick

）：

显示所有表格

显示序号1，隐藏其余部分

显示序号2，隐藏其余部分

显示编号5，隐藏其余部分

它们还切换一个类

“已激活”

，以更改背景颜色

我试图做的是，一旦我单击“Show Nº1，Hide rest”，禁用单击选项（在此div上），直到我首先单击另一个选项，如“Show all tables”或“Show Nº2，Hide rest”

类似于“一次功能”，但一旦另一个div被激活就会重置。有办法吗

这是我的CSS

选择器{
高度：25px；
宽度：25px；
背景色：#702C3D；
左边距：2倍；
右边距：2px；
浮动：左；
光标：指针；
}
.选择器已激活{
背景色：#000000；
}

这是我的JavaScript

$('.selector').on('click', function(event) {
  $('.selector').not(this).removeClass('activated');
  $(this).toggleClass('activated');
});

---

你应该能做到

if($(this).hasClass('activated'))
    return; 

---

如果这是allready激活的，则跳过它。

有两件事要做：

将JavaScript封装在函数中

每次单击某个对象时取消绑定click事件

以下是方法：

功能点击事件（元素）{
元素绑定（'click'，函数（事件）{
$（'.selector'）.not（this.removeClass（'activated'）；
$（this.toggleClass（'activated'）；
$（'.selector'）。取消绑定（'click'）；
clickEvent（$（'.selector'）。而不是（this））；
});
}
clickEvent（$（'.selector'））
选择器{
高度：25px；
宽度：25px；
背景色：#702C3D；
颜色：#FFF；//用于显示
左边距：2倍；
右边距：2px；
浮动：左；
光标：指针；
}
.选择器已激活{
背景色：#000000；
}

123456
如果在单击功能中将
切换类
更改为
添加类
。然后，在
中单击一次以上。激活的
将无效（因为单击被禁用）：

或者，您可以检查单击的
.selector
是否已激活
.activated
类，如：

$('.selector').on('click', function(event) {
  if($(this).is('.activated')) return;
  $('.selector').not(this).removeClass('activated');
  $(this).toggleClass('activated');
});

请您创建一个工作类，这样我们可以更方便地帮助您。如果您不想在单击两次时更改类，您不是真的只是请求
addClass
而不是
toggleClass
？@MoshFeu是的，对不起，上次我有一个问题，我将代码复制到了jsfiddle.net，但这次我无法让它工作。下一次我有问题时，我会确保创建一个问题，这样会更容易！：）@这正是我想做的，我会给下面建议同样事情的人正确的答案，但也谢谢你！我接受了另一个正确的答案，因为我更容易理解他在做什么（仍在学习，所以我想尝试了解我的每一行代码都做了什么，而无需以后寻求帮助）。但是感谢“包装JavaScript”的建议，我没有考虑过这样做然后调用函数！谢谢这正是我想要做的。两个选项都试过了，没有问题，但我可能会选择第二个。很高兴看到我可以保留所有的旧代码，只需要做一些小的调整就可以了，因为我还在学习。是的，出于性能原因，我推荐第二个。欢迎你，祝你好运。
$('.selector').on('click', function(event) {
  if($(this).is('.activated')) return;
  $('.selector').not(this).removeClass('activated');
  $(this).toggleClass('activated');
});