2013-05-30 188 views
0

这是我的代码。如果我点击并移动鼠标onmousemove事件应该发生。我怎样才能做到这一点。任何人都可以帮助我。发生鼠标点击事件时发生鼠标移动事件

 </head> 

     <body> 
     <img id="myImgId" alt="" src="Chrysanthemum.jpg" width="400" height="300" /> 

     <script type="text/javascript"> 
     <!-- 
     var myImg = document.getElementById("myImgId"); 
     myImg.onmousemove = GetCoordinates; 
     //--> 
     </script> 


     <p>X:<span id="x"></span></p> 
     <p>Y:<span id="y"></span></p> 
+0

我认为ü需要拖动事件 – PSR

+0

什么我计划是用绘制了图像的矩形内onmouosemove事件SVG和JavaScript事件。我在正确的道路上吗? – chiyango

+0

为此,您可以使用mousedown-mousemove-mouseup组合。 – Teemu

回答

0

您必须启用点击事件

</head> 

    <body> 
    <img id="myImgId" alt="" src="Chrysanthemum.jpg" width="400" height="300" onClick="doSomething(this)"/> 

    <script type="text/javascript"> 

    function doSomething(obj) 
    { 
    obj.onMouseMove = function getCoordinates(){ 
      var x= screen.getX; 
      var y = screen.getY; 
      } 
    } 
    </script> 


    <p>X:<span id="x"></span></p> 
    <p>Y:<span id="y"></span></p> 
0
<!doctype html> 
<html> 
<head> 
<meta charset="utf-8"> 
<title>Untitled Document</title> 
</head> 

<body> 
<img src="captain_america.jpg" style="left:0px;position:absolute;top:50px;"/> 
<div id="showCoordinates" style="top:0px;left:0px;position:absolute;height:40px;width:100px"></div> 
<script type="text/javascript"> 
document.addEventListener('mousemove', onMouseMove, false) 

function onMouseMove(e) 
{ 
    x = e.clientX; 
    y = e.clientY; 
    document.getElementById('showCoordinates').innerHTML = "x " + x + " y " + y; 
} 
</script> 
</body> 
</html>