javascript - 防止点击事件触发父操作

Question

我有包含用于删除该特定 li 的 anchor 标记的 li。 所以，我有 anchor 标记和 li 的 onclick 事件。单击 li 打开一个模式窗口，单击 anchor 标记应该隐藏该 li。

如何在 anchor 标记上触发单击事件而不触发 li 单击事件。 这是到目前为止我已经厌倦的:

JS:

$('body').on('click', 'a', function(e) {
    if(confirm('Are you sure you want to delete it?') == true){
        $(this).parent().hide();
    }
    //e.preventDefault();     
    e.stopPropagation();   
});

HTML:

<li onclick="openModal(0)">
  <a class="closer">X</a>
  <h3>Lolita</h3>
  <p>Check it</p>
</li>

Answer 1

这是你的答案:https://jsfiddle.net/jimedelstein/bsg4jq3m/

需要检测点击的目标，如果是链接就忽略它，否则触发li点击。

<li>
  <a class="closer">X</a>
  <h3>Lolita</h3>
  <p>Check it</p>
</li>


$('body').on('click', 'a', function(e) {
    if(confirm('Are you sure you want to delete it?') == true){
        $(this).parent().hide();
    } 
    e.stopPropagation();   
});

function openModal(e){
    if (e.target != $("a.closer")[0]){
     alert("not the link!");
  }
};

$("li").on("click", openModal);