javascript stop click stopPropagation inside bootstrap nav-pill for modal

Question

我正在使用 Bootstrap 3，并且试图在导航药丸中包含两个链接。一种是菜单中页面的标准链接。

另一个是垃圾箱链接到引导模式以确认删除。我遇到的问题是外部点击事件也会影响垃圾桶点击，所以我被带到页面并且我没有弹出模式。当我单击后退按钮时，模式会触发。

我曾尝试使用 stopPropagation，但现在模式没有触发。

$(".pagedelete").click(function(event) {
    event.stopPropagation();
});

HTML：

<ul id="pageMenu" class="nav nav-pills nav-stacked sortable ui-sortable">
    <li class="" id="item_1">
        <a href="/edit/issue/516/2224">
            <i class="fa fa-file-text"></i>
            <span class="page-title">Keith goes to the...</span>
            <span class="pageNum">Cover</span>
            <i class="pagedelete fa fa-trash-o" data-toggle="modal" href="#deletePage"></i>
        </a>
    </li>
    <li class="" id="item_2">
        <a href="/edit/issue/516/2224">
            <i class="fa fa-file-text"></i>
            <span class="page-title">Bob climbs the m...</span>
            <span class="pageNum">Page 1</span>
            <i class="pagedelete fa fa-trash-o" data-toggle="modal" href="#deletePage"></i>
        </a>
    </li>

我也尝试返回 false 但同样的问题。我确信我走在正确的轨道上，更多的是关于我如何实施它。

Answer 1

你可以尝试在a href之外提供垃圾链接

<ul id="pageMenu" class="nav nav-pills nav-stacked sortable ui-sortable">
<li class="" id="item_1">
    <a href="/edit/issue/516/2224">
        <i class="fa fa-file-text"></i>
        <span class="page-title">Keith goes to the...</span>
        <span class="pageNum">Cover</span>
    </a>
    <i class="pagedelete fa fa-trash-o" data-toggle="modal" href="#deletePage"></i>
</li>
<li class="" id="item_2">
    <a href="/edit/issue/516/2224">
        <i class="fa fa-file-text"></i>
        <span class="page-title">Bob climbs the m...</span>
        <span class="pageNum">Page 1</span>
    </a>
    <i class="pagedelete fa fa-trash-o" data-toggle="modal" href="#deletePage"></i>
</li>