如何忽略嵌套的jQuery手風琴click事件

Question

我有這個代碼

<div id="accordion">
  <h3>Section 1 <a href="www.google.com">Google</a> </h3>
  <div>
      Text...
  </div>
  <h3>Section 2</h3>
  <div>
   Text...
  </div>  
</div>

而且我無法在<h3>范圍內使用jQuery手風琴擴展/折疊事件happans中的<a>標簽。

如何避免該事件，使<a>與手風琴事件獨立工作？

Answer 1

您可以發布代碼或指向所使用的jquery插件的鏈接嗎？ 聽起來jquery代碼正在運行功能preventDefault（），並且a標簽冒泡並觸發該事件。

你可以在錨點上包裹一個事件

$('#accordian').on('click', 'a', function(e) {
    e.stopPropogation();
    window.location.href = this.href;
});

現在，如果您在錨標記中添加元素，請謹慎使用此代碼。 如果單擊該元素，它將不是開始事件的錨點，它將具有href屬性。

Answer 2

事件傳播，當有人單擊<a>標記時，可以停止事件傳播。 我相信這可以工作。

$(document).on('click', '.link', function (e) {e.stopPropagation();});

如果希望“鏈接”具有選擇器，則將類鏈接添加到<a> 。

<div id="accordion">
  <h3>Section 1 <a class="link" href="www.google.com">Google</a> </h3>
  <div>
    Text...
  </div>
  <h3>Section 2</h3>
  <div>
    Text...
  </div>  
</div>

Answer 3

我找到了對我來說很好的解決方案。

<div id="accordion">
  <h3>Section 1 <a href="www.google.com" class="openLink" onclick="OpenLink(this);">Google</a> </h3>
  <div>
      Text...
  </div>
  <h3>Section 2</h3>
  <div>
   Text...
  </div>  
</div>

 function OpenLink(element)
    {
        console.log(element.href);
        window.location = element.href;
        return false;
    }

還有另一種解決方案

$('.openLink').bind('blur change click error keydown keypress keyup mousedown mouseenter mouseleave mousemove mouseout mouseover mouseup', function (event) {
            event.stopPropagation();
        });