内部链接单击时，请单击“包装器”事件

Question

  <div class='wrap'>
          <a class='inner-link' href="#">Link</a>
    </div>

CSS

.wrap
{
  background:#CDD4E0;
  width:300px;
  height:100px;
  padding:20px;
}

.wrap:hover
{
  background:#868B93;
}

jquery

   $('.wrap').click(function () {
             alert("Handler for wrap container click.");
         });
         
   $('.inner-link').click(function () {
             alert("Handler for inner link click");
         });

我想做的是在我单击内部链接时使用类的容器.wrap

单击事件。 您可以参考此

Fiddle示例

.

。 当前的代码火

$('.wrap').click

当我为
$('.inner-link').click时做if
。

add

inner-link

检查目标是否不包含类。

Answer 1

$(".wrap").click(function (e) {
  if (e.target.className !== "inner-link") { // add this
    alert("Handler for wrap container click.");
  }
});

$(".inner-link").click(function (e) {
  e.stopPropagation(); // or add this
  alert("Handler for inner link click");
});

您可以使用

event.Stoppropagation

为此，您的jQuery代码应如下修改：

$('.wrap').click(function () {
  alert("Handler for wrap container click.");
});

$('.inner-link').click(function (event) {
  event.stopPropagation();
  alert("Handler for inner link click");
});

Answer 2

thanks @riceeater与班级有关。我用这个解决了：

var elem = $('.parentElem');
elem.on("click",function(e) {
  var hitElementClass = e.target.className;
  if (hitElementClass.includes("my-wrapper-class")) {
    elem.find("input").trigger("click");
  }
});