黑马程序员技术交流社区

标题: 运行JS代码遇到的问题 [打印本页]

作者: 小天    时间: 2013-8-27 17:36
标题: 运行JS代码遇到的问题
图片的onclick事件和图片的onmousemove事件不能同时执行

  1. <P><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "<A >http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd</A>">
  2. <html xmlns="<A >http://www.w3.org/1999/xhtml</A>">
  3. <head>
  4.     <title></title>
  5.     <script type="text/javascript">
  6.         document.onmousemove = initEvent;
  7.         function initEvent() {
  8.             var img = document.getElementById("img");
  9.             img.onclick = imgOnClick;
  10.             img.onmousemove = imgMouseMove;
  11.         }
  12.         function imgOnClick() {
  13.             var img = document.getElementById("img");
  14.             img.src = "/img/02.jpg";
  15.         }
  16.         function imgMouseMove() {
  17.             var img = document.getElementById("img");
  18.             var y = window.event.clientY;
  19.             var x = window.event.clientX;
  20.             if (x <= 681 && y <= 166) {
  21.                 img.src = "/img/lt.jpg";
  22.             }
  23.             else if (x <= 681 && y <= 316) {
  24.                 img.src = "/img/left.jpg";
  25.             }
  26.             else if (x <= 681 && y <= 466) {
  27.                 img.src = "/img/lb.jpg";
  28.             }
  29.             else if (x <= 906 && y <= 166) {
  30.                 img.src = "/img/rt.jpg";
  31.             }
  32.             else if (x <= 906 && y <= 316) {
  33.                 img.src = "/img/right.jpg";
  34.             }
  35.             else if (x <= 906 && y <= 466) {
  36.                 img.src = "/img/rb.jpg";
  37.             }
  38.         }
  39.     </script>
  40. </head>
  41. <body>   
  42. <p style="text-align:center;"><img src="/img/01.jpg" alt="" id="img" /></p>
  43. </body>
  44. </html>
  45. </P>
复制代码

作者: 许庭洲    时间: 2013-8-27 19:08
IE中如果在body上添加onclick, onmousemove等事件响应,那么如果页面没有满,则“body” 中最后一个元素以下(横向不限制)"的部分是无法响应事件的,必须使用代码在document上监听那些事件,比如document.onmousemove = MovePic




欢迎光临 黑马程序员技术交流社区 (http://bbs.itheima.com/) 黑马程序员IT技术论坛 X3.2