📌  相关文章
📜  JavaScript | MouseEvent shiftKey 属性(1)

📅  最后修改于: 2023-12-03 15:31:39.182000             🧑  作者: Mango

JavaScript | MouseEvent shiftKey 属性

介绍

MouseEvent 对象是在发生鼠标事件时传递给事件处理程序的事件对象。在 MouseEvent 对象中，有一个 shiftKey 属性，用来检测鼠标事件是否按下了 Shift 键。

属性值

shiftKey 属性值为布尔值，返回 true（按下了 Shift 键）或 false（未按下 Shift 键）。

使用方法

在对鼠标事件进行处理的相关函数中，可以使用 shiftKey 属性来检测是否按下 Shift 键。例如，在处理鼠标单击事件时，可以使用以下代码判断是否按下了 Shift 键：

document.addEventListener('click', function(event) {
  if (event.shiftKey) {
    console.log('Shift 键被按下');
  } else {
    console.log('Shift 键未被按下');
  }
});
效果展示

在代码片段中，当单击页面时，如果同时按下了 Shift 键，则在控制台中输出 "Shift 键被按下"，否则输出 "Shift 键未被按下"。可以尝试按下和释放 Shift 键，观察效果。

<!DOCTYPE html>
<html>
  <head>
    <meta charset="utf-8">
    <title>Demo</title>
  </head>
  <body>
    <script>
      document.addEventListener('click', function(event) {
        if (event.shiftKey) {
          console.log('Shift 键被按下');
        } else {
          console.log('Shift 键未被按下');
        }
      });
    </script>
  </body>
</html>
结论

MouseEvent 对象的 shiftKey 属性可以用来检测鼠标事件是否按下了 Shift 键。在处理鼠标事件时，这个属性可以方便地进行条件判断，达到更好的用户体验。