如何通过jQuery中的父div来防止click()事件?

前端之家收集整理的这篇文章主要介绍了如何通过jQuery中的父div来防止click()事件?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
情况:
  1. <div class="header">
  2. <div style="float: left;" class="headerTitle">+ OPEN</div>
  3. <div class="closeBtn" style="float: right;">- CLOSE</div>
  4. </div>
  5. <div class="touristenContent">.....</div>

视觉上

  1. |+Open..............................|-Close|..| (header)
  2.  
  3. |............Content..........................|

标题DIV是一个“大按钮”,jQuery click()事件用于打开内容
关闭DIV位于大标题DIV内,代表关闭按钮,还可以使用click()事件关闭内容
这个关闭按钮只有通过点击大标题才能看到。

点击标题并对内容进行操作,如期望,但点击关闭按钮让点击事件通过标题DIV。内容关闭并再次打开两次点击事件。

那么我如何正确设计整个事情,使关闭按钮牢固,并防止点击它到标题

解决方法

你需要在 stop the event from propagating添加DOM树:
  1. $('.closeBtn').click(function (evt) {
  2. evt.stopPropagation();
  3.  
  4. // Your code here
  5. });

猜你在找的jQuery相关文章