为什么 Logging onclcik 事件在 chrome 中未定义？

Question

    <ul onClick='pop()'>
    <li id="1">1</li>
    <li>2</li>
    <li>3</li>
    <li>4</li>
    <li>5</li>
   </ul>

    function pop(event) {
    let ul = document.getElementsByTagName('ul')[0];
    console.log(window.event); //Valid mouseEvent
    console.log(event) // Undefined
}

所以问题是为什么记录事件结果未定义而 window.event 具有有效值？浏览器 - chrome

Answer 1

因为您没有向 pop 传递任何内容，所以参数的值为 undefined，当函数需要一个您没有提供任何参数的参数时，情况总是如此。

<ul onClick='pop()'>
<!--             ^−−−− Nothing here -->

两种解决方案：

使用现代事件处理（addEventListener，等等）。 Chrome（和其他浏览器）将确保 pop 始终与事件对象一起调用。
通过包装在代码周围的生成函数接收的事件：
```
<ul onClick='pop(event)'>

```
请注意，该代码段中的 event 不是全局参数，它是浏览器为您生成的函数的局部 event 参数环绕您放入属性中的代码。

Answer 2

以下是高效处理事件的方法。您没有将任何事件传递给 pop。

function pop(event) {
  let ul = document.getElementsByTagName('ul')[0];
  console.log(window.event); //Valid mouseEvent
  console.log(event) // Undefined
}

document.getElementById("yourid").addEventListener('click', pop);

<ul id="yourid">
  <li id="1">1</li>
  <li>2</li>
  <li>3</li>
  <li>4</li>
  <li>5</li>
</ul>

为什么 Logging onclcik 事件在 chrome 中未定义？

Why does Logging onclcik event turns out to be undefined in chrome?

javascript

google-chrome

onclick

event-delegation

dom-events