event对象学习

来源：互联网发布：外企工作知乎编辑：程序博客网时间：2024/06/06 07:35

<!DOCTYPE html>
<html>
<head>
  <meta charset="utf-8">
  <title>event对象学习</title>
  
  <script type="text/javascript">
   function testEvent(eve){
    //因为浏览器的差异问题，所以在获取event对象时，采用一下方式
    var eve=eve||window.event;
    //获取鼠标坐标
    var x=Math.ceil(eve.x)||Math.ceil(eve.pagX);
    var y=Math.ceil(eve.y)||Math.ceil(eve.pagY);
    //alert(eve);
    //alert(eve.pageX+":"+eve.pageY);
    //alert(eve.x+":"+eve.y);
    alert(x+":"+y);
   }
   function testKeyCode(eve){
    //获取event对象
    var eve=eve||window.event;
    alert(eve.keyCode);
   }

  </script>
  <style type="text/css">
   #showdiv{
    border: solid 1px;
    width: 300px;
    height: 300px;

   }
  </style>
</head>
<body>
  <h3>event对象学习</h3>
  <input type="button" name="" id="" value="获取鼠标坐标" onclick="testEvent(event);"/>
  <input type="text" id="" value="" onkeyup="testKeyCode(event);"/><br />
  <br />
  <div id=showdiv onmousemove="testEvent(event);">

  </div>
</body>
</html>

阅读全文

0 0