finding child div id which is clicked in a div tag

Question

I have code in html like

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

in controller.js

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

});

When user clicks in the div tag he should click on any of the span tags. Using the code we are able to get the div id. But actually I need to know which span is clicked. Means id="1" or 2 or 3 ... Thank you.

Possible duplicate https://stackoverflow.com/a/23107800/5462775 — Ali Ezzat Odeh, Nov 16 '17 at 12:12
Possible duplicate of [jQuery click event on parent, but finding the child (clicked) element](https://stackoverflow.com/questions/12758547/jquery-click-event-on-parent-but-finding-the-child-clicked-element) — Nikola Lukic, Nov 16 '17 at 12:18

score 0 · Answer 1 · answered Nov 16 '17 at 13:47

0

you can use clickevent, this might work:

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

    $('.click').on('click', function(event) {
    alert($(event.target).attr('id'));
    });

answered Nov 16 '17 at 13:47

Shivin Agarwal

158
2
16

Actually, we should not need to use events for child tags – ramprakash seepana Nov 16 '17 at 18:48

finding child div id which is clicked in a div tag

1 Answers1