跳至主要內容

浏览器默认行为

Yang小于 1 分钟

描述

许多事件会自动触发浏览器执行某些行为,例如:

  • 点击一个链接:触发导航(navigation)到该 URL
  • 点击表单的提交按钮:触发提交到服务器的行为。
  • 在文本上按下鼠标按钮并移动:选中文本

阻止默认行为

  • 主流的方式是使用 event 对象,有一个 event.preventDefault() 方法
  • 如果处理程序是使用 on<event>(而不是 addEventListener)分配的,那返回 false 也同样有效

event.defaultPrevented

如果默认行为被阻止,那么 event.defaultPrevented 属性为 true,否则为 false

<!DOCTYPE html>
<html lang="zh">
  <head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
  </head>
  <body>
    <button id="elem1">Element1</button>
    <button id="elem2">Element2</button>

    <script>
      elem1.oncontextmenu = function(event) {
        event.preventDefault()
        console.log('Element 1 Click')
      };
      elem2.oncontextmenu = function(event) {
        console.log('Element 2 Click')
      };

      document.oncontextmenu = function(event) {
        console.log(event.defaultPrevented)
      };
    </script>
  </body>
</html>
上次编辑于:
贡献者: sunzhenyang