JavaScript obti...LOGIN

JavaScript obtient les coordonnées de la souris

Les coordonnées de la souris incluent les coordonnées x, les coordonnées y, les coordonnées relatives au client, les coordonnées relatives à l'écran, etc.

En JavaScript, les coordonnées de la souris existent en tant qu'attributs de l'objet événement. Les propriétés liées aux coordonnées de la souris dans l'objet événement

sont les suivantes.

QQ截图20161013101054.png

QQ截图20161013101100.png

Obtenez les informations de coordonnées de la souris.

<html>
<head>
<title>获取鼠标的坐标信息</title>
</head>
<body>
<div id="demo">点击这里</div>
<script type="text/javascript">
document.getElementById("demo").onclick=function(e){
    var eve = e || window.event;
    var x = eve.clientX,  // 相对于客户端的X坐标
        y = eve.clientY,  // 相对于客户端的Y坐标
        x1 = eve.screenX,  // 相对于计算机屏幕的X坐标
        y1 = eve.screenY;  // 相对于计算机屏幕的Y坐标
        
    alert(
        "相对客户端的坐标:\n"+
        "x = "+x+"\n"+
        "y = "+y+"\n\n"+
        "相对屏幕的坐标:\n"+
        "x = "+x1+"\n"+
        "y = "+y1
    );
}
</script>
</body>
</html>


section suivante
<html> <head> <title>获取鼠标的坐标信息</title> </head> <body> <div id="demo">点击这里</div> <script type="text/javascript"> document.getElementById("demo").onclick=function(e){ var eve = e || window.event; var x = eve.clientX, // 相对于客户端的X坐标 y = eve.clientY, // 相对于客户端的Y坐标 x1 = eve.screenX, // 相对于计算机屏幕的X坐标 y1 = eve.screenY; // 相对于计算机屏幕的Y坐标 alert( "相对客户端的坐标:\n"+ "x = "+x+"\n"+ "y = "+y+"\n\n"+ "相对屏幕的坐标:\n"+ "x = "+x1+"\n"+ "y = "+y1 ); } </script> </body> </html>
soumettreRéinitialiser le code
chapitredidacticiel