Jquery remove类正在重新应用该类

Question

我是jquery的新手,我试图添加然后删除一个div类.首先,我addClass();在单击div时添加类名,然后我想通过单击链接将其删除.这是我到目前为止编写的代码,但它不起作用. https://jsfiddle.net/j2tsk90k/1/

我究竟做错了什么？

HTML:

<div class="block yellow expandable skewX">
<div>Test</div> <span id="transp">  
<a id="close">close</a>
</span>
</div>

JS:

$('.expandable').on('click', function () {
 $(this).addClass('fullscreen');
});

$('#close').click(function () {
 $('.expandable').removeClass('fullscreen');
});

注意:

• 在Firefox上,它表现得像是在点击链接时重新应用该类.
• 在Chrome上,该链接无法点击.

提前致谢

Answer 1

这是因为在子点击时触发了父事件.您需要停止事件传播到子元素:

$('#close').click(function (e) {
  e.stopPropagation()
  $('.expandable').removeClass('fullscreen');
});

工作演示