Question

我手风琴中有一个链接，但每当我点击链接时，手风琴都会认为我试图关闭它。它的设置让你可以点击手风琴上的任何地方来打开或关闭它，我想保留它，但当我点击链接时，忽略手风琴行为并改为关注链接。

<div class="wrap">
    <div class="top"></div>
    <div class="middle">
        <h3>Always showing</h3>
        <div class="hidden">
            <p>I want to <a href="/lets-gooo">follow this link</a>.</p>
        </div>
    </div>
    <div class="bottom"></div>
</div>


$('.wrap').on(touchClick, function (e) {
    if ($(this).hasClass('active')) {
        $(this).removeClass('active');
        $(this).find('.hidden').slideUp('fast');
        return false;
    }
    $('.wrap').each(function (index, el) {
        $(this).removeClass('active');
        $(this).find('.hidden').slideUp('fast');
    });
    $(this).find('.hidden').slideDown('fast');
    $(this).addClass('active');
});

Answer 1

未经测试，但我相信这会有效

$('.wrap').on(touchClick, function (e) {
//other code
});
$( "a" ).click(function( event ) {
  event.stopPropagation();
});

它应该阻止点击冒泡并触发手风琴事件。

如果你想使用touchClick就像你手风琴一样，你可以将其重写为。

$( "a" ).on(touchClick, function (e) {
  e.stopPropagation();
});

Answer 2

您需要告诉浏览器停止使用event.stopPropagation()冒充事件链的事件（有关详细信息，请参阅this so post）。这意味着jQuery永远不会知道click事件，因此它不会关闭手风琴。

在特定链接的点击事件监听器中添加它，它应该按照您的要求工作：

$('.wrap a').each(function(e){
   e.stopPropagation(); // stop the event from bubbling up
});

但是，不要将它与event.preventDefault()混淆，后者不会阻止事件冒泡，但会阻止浏览器在点击时打开链接。

手风琴防止点击链接

2 个答案: