Javascript $event.stopPropagation（）运行，但仍会执行父事件

因此，我有一个按钮，它位于链接到另一个位置的

标记内。当我单击按钮时，我希望它不会触发父标记中的链接。我尝试过使用

$event.stopPropagation（）

，但似乎不起作用

这是我的html：

<div class="column" ng-repeat="eventObj in events" ng-repeat-dimmer>
      <a href="#/sample-event/{{eventObj.eventId}}">
        //divs
              <h2>{{eventObj.eventName}}</h2>
              <div>{{eventObj.eventStart | date}} - {{eventObj.eventEnd | date}}</div>
              <h5>{{eventObj.eventVenue}}</h5>
              <button ng-click="deleteEvent(eventObj,$event)"></button>
        //divs
        <img class="ui image" src="assets/img/sampleevent.png"/>
      </a>
    </div>

---

我在这里做什么？

使用event.preventDefault，这里是一个示例

<script>
function clickFunction(e)
{
alert('click');

    e.preventDefault();
}
</script>
<a href="http://google.com" target="_blank">
  <button onclick="clickFunction(event);">
  test
  </button>
</a>

功能点击功能（e）
{
警报（“点击”）；
e、 预防默认值（）；
}

至于它为什么不起作用，触发超链接是一个默认事件，而不是一个事件侦听器。如果链接上有onclick而不是href，则event.stopPropagation可以工作，请参阅下面的文档

发件人：

1.2.3。事件冒泡

指定为冒泡的事件最初将以与非冒泡事件相同的事件流进行。事件被调度到其目标EventTarget，并触发在那里找到的任何事件侦听器。冒泡事件随后将触发通过向上跟踪EventTarget的父链找到的任何其他事件侦听器，检查在每个后续EventTarget上注册的任何事件侦听器。此向上传播将持续到文档，包括文档。在此阶段将不会触发注册为捕获器的EventListeners。从事件目标到树顶部的事件目标链在事件初始分派之前确定。如果在事件处理期间对树进行了修改，则事件流将根据树的初始状态继续进行

任何事件处理程序都可以通过调用事件接口的stopPropagation方法来阻止进一步的事件传播。如果任何EventListener调用此方法，将触发当前EventTarget上的所有其他EventListener，但冒泡将在该级别停止。只需调用StopRopagation一次，即可防止进一步冒泡

1.2.4。事件取消

某些事件被指定为可取消。对于这些事件，DOM实现通常具有与事件关联的默认操作。例如，web浏览器中的超链接。当用户单击超链接时，默认操作通常是激活该超链接。在处理这些事件之前，实现必须检查为接收事件而注册的事件侦听器，并将事件分派给这些侦听器。然后，这些侦听器可以选择取消实现的默认操作或允许默认操作继续。对于浏览器中的超链接，取消操作将导致不激活超链接

取消是通过调用事件的preventDefault方法来完成的。如果一个或多个EventListener在事件流的任何阶段调用preventDefault，则默认操作将被取消

---

不同的实现将指定与每个事件关联的自己的默认操作（如果有）。DOM不会尝试指定这些操作。

还要在$event.stopPropagation（）之后添加$event.preventdefault（）。希望它能帮助你尝试添加returnfalse；在deleteEvent函数的末尾。@SaurabhAhuja这项功能成功了，谢谢！我可以问一下为什么preventDefault起作用而stopPropagation不起作用吗？@Markus，stopPropagation只会停止所谓的“冒泡”事件，它只会向下进行。因此，不会停止父级。但是，preventDefault会停止整个操作。即使是父母触发的谢谢你！这起作用了。我可以问一下为什么preventDefault有效而stopPropagation无效吗？

<script>
function clickFunction(e)
{
alert('click');

    e.preventDefault();
}
</script>
<a href="http://google.com" target="_blank">
  <button onclick="clickFunction(event);">
  test
  </button>
</a>