在angularjs中获得具有相同类名的div索引

Question

我有同一个类名的多个div，每个div都有多个element（input，select和...）。 现在我想将事件添加到输入元素。 输入事件运行时如何查找div索引？

<div class="container">
  <div class='item'>
          <input type="text" ng-click='test()'>
          <input type="text" >
          <input type="text" ng-click='test()'>
 </div>
<div class='item'>
          <input type="text" ng-click='test()'>
          <input type="text" >
          <input type="text" ng-click='test()'>
 </div>
  <div class='item'>
          <input type="text" ng-click='test()'>
          <input type="text" >
          <input type="text" ng-click='test()'>
 </div>
</div>

Answer 1

鉴于您的原始文章的评论，我对你的期望的功能的理解是这样的：当用户键入到input元素，标识div元素是input的容器，和alert()中div元素的class属性。

为了做到这一点，就像我在帖子评论中所说的那样，您可以使用jQuery的parent()方法，该方法将返回元素的父级作为jQuery对象，然后使用jQuery的attr()方法检查父级的class属性。

JSFiddle

如果您使用的是jQuery：

$(document).on('keyup', '.container input', function() {
    var $inputElement = $(this); // `this` is the event target
    var $parentDiv = $inputElement.parent();
    var parentClassName = $parentDiv.attr('class');
    alert(parentClassName);
});

如果您不使用jQuery：

var inputElements = document.querySelectorAll('.container input');

for(var i = 0; i < inputElements.length; i++) {
    inputElements[i].addEventListener('onkeyup', function(evt) {
        var inputElement = evt.target; // access event target using `evt.target`
        var parentDiv = inputElement.parentNode; // get the event target's parent element
        alert(parentDiv.className);
    });
}