Javascript 父元素和单击的元素正在捕获onClick事件

我有一个div，里面有一些元素

我的父div有一个使用onClick的测试函数。 在内部父div中，有一个使用onClick的quickView函数

现在，当我点击quickView函数时，测试函数被激活

<div onClick="test();" class="product-inner">
  <h5 class="product-title height-40-px">


    title

    </p>
  </h5>
<hr class="mt8 mb8">
<div class="product-meta">
  <ul class="product-price-list">

    <li><span class="product-save dir-to-right"><strong>7500</strong></span>
    </li>
    <li><span class="product-old-price dir-to-right">120,000</span>
    </li>
    <li><span class="product-price">%95</span>
    </li>
  </ul>
  <hr class="mt0 mb0 mr6 hr-blue">
  <div class="col-md-12 mt10">

    <span class="col-md-6">
      ۹&nbsp;<i class="fa fa-users"></i>
    </span>

    <span class="col-md-6">

      <p class="font-size-12 display-inline">


        zone
        &nbsp;<i class="fa fa-map-marker"></i>


      </p>

    </span>

  </div>

  <ul class="product-actions-list mt35">

    <li><a data-original-title="add cart" class="btn btn-cart btn-sm popup-text" href="#product-quick-view-add-to-cart" onclick="quickView(18730);" data-effect="mfp-move-from-top" data-toggle="tooltip" data-placement="top" title="">cart&nbsp;<i class="fa fa-shopping-cart"></i></a>
    </li><li><a href="" class="btn btn-buy btn-sm">details&nbsp;<i class="fa fa-eye"></i></a>
    </li>
  </ul>
</div>
</div>

---

单击事件从单击的内部元素向上冒泡到文档根，并遍历单击元素的所有父元素。为了阻止它向上传播，应该使用-event.stopPropagation

单击事件从单击的内部元素向上冒泡到文档根，并通过单击元素的所有父元素。为了阻止它向上传播，应该使用-event.stopPropagation

使用event.stopPropagation防止单击事件传播到父级。这就是你使用它的方式

p.S.IE支持e.cancelBubble而不是e.stopPropagation

函数quickViewvalue，e{ 如果！e var e=window.event； e、 取消气泡=真； 如果e.stopPropagation e.stopPropagation； console.logvalue； } 功能测试{ console.log'testfired'； } 标题

7500 120,000 %95 ۹

区

使用event.stopPropagation可防止单击事件传播到父级。这就是你使用它的方式

p.S.IE支持e.cancelBubble而不是e.stopPropagation

函数quickViewvalue，e{ 如果！e var e=window.event； e、 取消气泡=真； 如果e.stopPropagation e.stopPropagation； console.logvalue； } 功能测试{ console.log'testfired'； } 标题

7500 120,000 %95 ۹

区

---

这就是事件冒泡的工作原理。首先，在您的案例中实际单击a.btn.btn-cart的元素上触发click事件，然后它向上移动，并通过test到达父div。通过将事件传递给quickView函数并调用event.stopPropagation，可以防止进一步的事件传播。然后，您的HTML应该如下所示：

<a class="btn btn-cart btn-sm popup-text" onclick="quickView(event, 18730);">Cart</a>

---

这就是事件冒泡的工作原理。首先，在您的案例中实际单击a.btn.btn-cart的元素上触发click事件，然后它向上移动，并通过test到达父div。通过将事件传递给quickView函数并调用event.stopPropagation，可以防止进一步的事件传播。然后，您的HTML应该如下所示：

<a class="btn btn-cart btn-sm popup-text" onclick="quickView(event, 18730);">Cart</a>

---

是，因为无论何时在该父div内单击，都将调用父div的Onclick函数。可能重复是，因为无论何时在该父div内单击，都将调用父div的Onclick函数。javascript函数quickView中的javascript函数quickView中可能重复