gpt4 book ai didi

javascript - 元素及其父元素指定了 ng-click,两者都被称为

转载 作者:行者123 更新时间:2023-12-02 16:48:16 25 4
gpt4 key购买 nike

假设我有一个 DIV,其中指定了当通过 ng-click 单击它时调用的函数。

在此DIV内有一个BUTTON,它还有一个在单击时调用的函数,由ng-click指定。

当我单击按钮时,DIV 的单击函数和 BUTTON 的单击函数都会被调用。如何才能只调用 BUTTON 的函数?

我已经设置了这个fiddle为了更好地说明我的意思。下面是代码:

HTML:

<body ng-app="Test">
<section ng-controller="TestCtrl as ctrl">
<div class="square" ng-click="ctrl.divClick()">
<span>My text</span>
<button ng-click="ctrl.buttonClick()" >My button</button>
</div>
</section>
</body>

JavaScript:

(function() {
var app = angular.module('Test', []);

app.controller('TestCtrl', [function() {
this.divClick = function() {
alert('div clicked');
};

this.buttonClick = function() {
alert('button clicked');
}
}]);
})();

编辑:

根据akonsu的建议,我只需要停止事件传播。这对我有用。这是更新的Fiddle展示它是如何工作的。

最佳答案

停止事件的传播:

<button ng-click="ctrl.buttonClick($event)">

this.buttonClick = function(e) {
e.stopPropagation();
alert('button clicked');
}

关于javascript - 元素及其父元素指定了 ng-click,两者都被称为,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/26913266/

25 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com