单击子元素时阻止父类答案

【问题标题】：Prevent parent class when child element is clicked单击子元素时阻止父类
【发布时间】：2014-09-01 15:49:36
【问题描述】：

正如您从我创建的 bootply 中看到的那样，当您单击面板中的任意位置时，输入将变为活动状态。当我单击信息按钮（橙色图标）时，它应该打开一个手风琴，而父（输入）没有激活。问题是父母仍然变得活跃。

我可以通过添加来解决这个问题：

$('.tickets-more').click(function(){
   event.stopPropagation();
});

但这会阻止信息按钮（橙色图标）完全起作用（手风琴无法打开）。

这是没有上述 sn-p 的 bootply - http://www.bootply.com/ZKoCxNfMqc 这里是 sn-p - http://www.bootply.com/WW3Ze2DEpg

【问题讨论】：

如果你不想要那个功能，你为什么把所有的内容都放在一个标签里？
event 变量来自哪里？
抱歉，我错过了什么吗？标签在做什么？
label是input的label，只要点击label，input就会改变状态，label的作用是什么？

标签： javascript jquery html

【解决方案1】：

当目标元素没有类info-sign时，只需添加/删除类。

Updated Example

$(".ticket-selector").off('click');
$(".ticket-selector").on('click', function(e){
  if(!$(e.target).hasClass('info-sign')) {
    $(".ticket-selector").removeClass("active");
    $(this).addClass("active");
  }
});

..正如其他人已经说过的那样，您还应该避免将所有内容放在 label 元素中。

【讨论】：