为什么body元素上的onclick事件不起作用

Why is the onclick event on the body element not working?

本文关键字：onclick 事件 不起作用 body 元素 为什么      更新时间：2023-09-26

当点击html body时，我正试图将用户发送到另一个页面：

JavaScript c.js:

function clickBody(){
    window.location.href = '/';
}

HTML:

<!DOCTYPE html>
<html>
<head>
  <script src="c.js"></script>
</head>
<body onclick="clickBody();" />
</html>

我可以从控制台运行该功能，但单击<body>不起作用。

<body>元素为空。你必须在CSS中改变它的高度，或者在里面放一些文本

此外，使用element.addEventListener()可能是个好主意。请参阅addEventListener与onclick。

参见代码片段：

function clickBody() {
    window.location.href = '/'
}
document.body.addEventListener("click", clickBody)
<!DOCTYPE html>
<html>
<head>
    <script src="c.js"></script>
</head>
<body>
  <p>Try clicking me.</p>
</body>  
</html>

<body>元素没有高度。添加类似以下代码的内容：

<!DOCTYPE html>
<html>
<head>
  <style>
    body {
      height: 500px;
    }
  </style>
  <script src="c.js"></script>
</head>
<body onclick="clickBody();/>  
</html>

我使用窗口而不是文档。body

window.onclick = () => {
console.log('Page clicked')
}
<h1>click anywhere on this page</h1>

相关文章：