javascript - 单击 href 和单击复选框时选中复选框

Question

我知道有很多主题可以通过单击 href 来检查复选框，但是在我看到的每个解决方案中，您都不能通过单击复选框来检查复选框，因为它被 <a> 包裹着标签。

这是我的 html :

<a href='#' id='cb'>mode<input type='checkbox' id='mode'></a>

我的 Jquery:

    $("#cb").click(function(e) {
        e.preventDefault();
        $("#mode").prop("checked", !$("#mode").prop("checked"));
    })

我需要什么:

我需要能够通过单击 href 和单击复选框来选中复选框。

如果这篇文章是重复的，很抱歉，我没有看到它，请将副本链接给我，我会删除它。

JSFiddle

Answer 1

点击输入时检查要防止的目标标签名称 - https://jsfiddle.net/fwzd08cw/2/

$("#cb").click(function(e) {
    if((e.target).tagName == 'INPUT') return true; 
    e.preventDefault();
    $("#mode").prop("checked", !$("#mode").prop("checked"));
});

$("#cb").click(function(e) {
  if((e.target).tagName == 'INPUT') return true; 
  e.preventDefault();
  $("#mode").prop("checked", !$("#mode").prop("checked"));
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<a href='#' id='cb'>mode<input type='checkbox' id='mode'></a>