AngularJS 和 jQuery - 如何在其父项的 Click 事件中找到子 div 的 ID？答案

【问题标题】：AngularJS & jQuery - How to find the ID of a child div on a Click event for its parent?AngularJS 和 jQuery - 如何在其父项的 Click 事件中找到子 div 的 ID？
【发布时间】：2018-04-29 08:31:10
【问题描述】：

我的 HTML 代码如下：

<div id="edit" ng-click="editFunction($scope)">
  <span id="1">
    click1
  </span>
  <span id="2">
    click2
  </span>
  <span id="3">
    click3
  </span>
  <span id="4">
    click4
  </span>
  ....
</div>

在 controller.js 中：

myDIV.controller('control',function($scope){
   $scope.editFunction($event){
    alert($event.target.id);
   }
});

当用户点击 div 标签时，他应该点击任何 span 标签。使用代码我们可以得到 div id。

但是，我需要知道点击了哪个跨度。意思是那个跨度的ID。

【问题讨论】：

不清楚你在问什么。你说你得到了来自目标的 id，它是 <span> 。所以看起来代码已经完成了你的要求
我相信你必须在回调函数中传递 $event 而不是 $scope
我的意图是当我点击 div 标签时，它将被点击任何 span 标签，因为所有 span 标签都在 div 标签中。所以当我点击 div 时，我得到了 div ID。但我想要 SPAN 的 ID，它正在被点击。谢谢！

标签： javascript jquery html css angularjs

【解决方案1】：

通过发送$index，可以得到当前repeat中元素的编号。

因此，与其尝试发送事件，然后从中了解点击了哪个跨度，不如使用 Angular 为您提供的开箱即用的工具。

HTML

<div id="edit">
    <span ng-repeat="click in clicks" ng-click="editFunction($index)">
        {{ click }}
    </span>
</div>

然后在你的控制器中：

myDIV.controller('control',function($scope){

    $scope.clicks = [1, 2, 3, 4]; // Fill the array with real data.

    $scope.editFunction(index){
        alert(index);
    }
});

【讨论】：

但是我们有 div 标签但没有 span 标签的事件
@ramprakashseepana 因为这是有角度的，所以您不需要任何事件，ng-click 属性确保当您单击它时会转到相关功能，并且由于您将索引发送给它，所以它知道要更改什么索引。我建议你在角度上刷一点，然后对你来说会更容易。

【解决方案2】：

你可以这样使用

 <div id="edit" ng-click="editFunction($event)">
 element.target.attributes.id.value

【讨论】：