Question

感谢SO的精彩贡献者！当你开始理解它时，jQuery会更酷。：）

所以我有一个LI，当点击显示/隐藏孩子UL。我想要做的是能够点击LI内部的链接打开一个空白窗口，但也不能关闭子UL。空白窗口打开

a[href^="http://"]').attr("target", "_blank");

但是，我不确定如何在LI上“return：false”，因此当空白窗口打开时它不会关闭UL。我希望用户能够在关闭空白窗口时看到他们所在的孩子UL。

如果不清楚，请告诉我。

谢谢！

Answer 1

我认为您正在寻找的可能是event.stopPropagation（）

以下是文档：http://api.jquery.com/event.stopPropagation/

基本上，正在发生的事情是当您点击<a>时，点击事件正在触发，但由于它包含在<li>中，因此也会触发点击事件。从子项到父项的事件过程称为事件冒泡。您可以使用event.stopPropagation（）来阻止它。

假设你有一个像这样的HTML结构：

<ul>
    <li class="reveal">One<br />
        <a href="http://www.google.com" target="_blank">Google</a>
            <ul>
                <li>a</li>
                <li>b</li>
                <li>c</li>
        </ul>
    </li>
    <li class="reveal">Two<br />
        <a href="http://www.google.com" target="_blank">Google</a>
            <ul>
                <li>a</li>
                <li>b</li>
                <li>c</li>
        </ul>
    </li>
    <li class="reveal">Three<br />
        <a href="http://www.google.com" target="_blank">Google</a>
            <ul>
                <li>a</li>
                <li>b</li>
                <li>c</li>
        </ul>
    </li>
</ul>

此外，我们会说你有一个CSS规则：

ul ul { display: none; }

应用这个jQuery，你应该得到你正在寻找的结果：

$(function () {
    $('.reveal').click(function() {
        $(this).children('ul').slideToggle();
    });

    $('.reveal a').click(function(event) {
        event.stopPropagation();
    });
});

以下是此动作的实时演示：http://jsfiddle.net/PaxTg/

Answer 2

您可能希望查看event orders，然后在合适的时间停止宣传活动。

jQuery - 单击LI，显示/隐藏UL - 单击LI：a href，继续显示UL并在空白窗口中打开

2 个答案: