javascript - 为什么登录时 html event.currentTarget 为 null

Question

function hide (e){
    console.log(e);//but in the Console click on triangle the currentTarget is null,why?
    console.log(e.currentTarget) //is an object.
}
var ps = document.getElementsByTagName('p');

for(var i = 0; i < ps.length; i++){
    ps[i].addEventListener('click', hide, false);
}

我认为 currentTarget 在 html 中已经有 2 年不“可用”了(我曾经是 as3 开发人员)。现在我试图找出为什么它不“可用”，但是当我找到此引用 MDN Event.target 时，e.currentTarget 显示了一个对象，这让我很困惑。现在 currentTarget 对我来说“可用”，它让我的生活更轻松，但我只是想知道为什么控制台对我撒谎

Answer 1

问题在于标签是动态生成的，因此您必须提升范围，并将事件监听器附加到非动态生成的元素。

这是一个 jQuery 示例，将监听器附加到 document:

$(document).on("click", "p", function(e) {
  console.log(e.currentTarget);
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<p>
  One
</p>
<p>
  Two
</p>
<p>
  Three
</p>

因为 document 始终可用，因此它始终会附加监听器。然后，它只是“等待”创建动态元素，然后再应用其点击事件。

我还创建了一个 fiddle 来演示这个 here .

希望这有帮助! :)