js鼠标、键盘事件实例代码

1. 鼠标的哪个按键被点击?

<html> 
<head> 
<script type="text/javascript"> 
function whichButton(event) 
{ 
if (event.button==2) 
{ 
alert("你点击了鼠标右键!") 
} 
else 
{ 
alert("你点击了鼠标左键!") 
} 
} 
</script> 
</head> 

<body onmousedown="whichButton(event)"> 
<p>请单击你鼠标的左键或右键试试</p> 
</body> 
</html> 


2. 当前鼠标的光标坐标是多少?
<html> 
<head> 
<script type="text/javascript"> 
function show_coords(event) 
{ 
x=event.clientX 
y=event.clientY 
alert("X 坐标: " + x + ", Y 坐标: " + y) 
} 
</script> 
</head> 

<body onmousedown="show_coords(event)"> 

<p>在此文档中按下你鼠标的左键看看!</p> 

</body> 
</html> 


3. 被按下键的unicode码是多少? 
<html> 
<head> 
<script type="text/javascript"> 
function whichButton(event) 
{ 
alert(event.keyCode) 
} 

</script> 
</head> 

<body onkeyup="whichButton(event)"> 
<p>在此文档中按下你键盘上的某个键看看</p> 
</body> 
</html> 


4. 当前鼠标的光标相对于屏幕的坐标是多少? 
<html> 
<head> 

<script type="text/javascript"> 
function coordinates(event) 
{ 
x=event.screenX 
y=event.screenY 
alert("X=" + x + " Y=" + y) 
} 

</script> 
</head> 
<body onmousedown="coordinates(event)"> 

<p> 
点击你鼠标的左键 
</p> 

</body> 
</html> 


5. 当前鼠标的光标坐标是多少? 
<html> 
<head> 

<script type="text/javascript"> 
function coordinates(event) 
{ 
x=event.x 
y=event.y 
alert("X=" + x + " Y=" + y) 
} 

</script> 
</head> 
<body onmousedown="coordinates(event)"> 

<p> 
点击你鼠标的左键 
</p> 

</body> 
</html> 



6。shift键是否按下? 
<html> 
<head> 
<script type="text/javascript"> 
function isKeyPressed(event) 
{ 
  if (event.shiftKey==1) 
    { 
    alert("shit键按下了!") 
    } 
  else 
    { 
    alert("shit键没有按下!") 
    } 
  } 
</script> 
</head> 

<body onmousedown="isKeyPressed(event)"> 

<p>按下shit键,点击你鼠标的左键</p> 

</body> 
</html> 

7. 当前被点击的是哪一个元素? 
<html> 
<head> 
<script type="text/javascript"> 
function whichElement(e) 
{ 
var targ 
if (!e) var e = window.event 
if (e.target) targ = e.target 
else if (e.srcElement) targ = e.srcElement 
if (targ.nodeType == 3) // defeat Safari bug 
   targ = targ.parentNode 
var tname 
tname=targ.tagName 
alert("你点击了 " + tname + "元素") 
} 
</script> 
</head> 

<body onmousedown="whichElement(event)"> 
<p>在这里点击看看,这里是p</p> 


 
<h3>或者点击这里也可以呀,这里是h3</h3> 
<p>你想点我吗??</p> 
<img border="0" src="../myCode/btn.gif" width="100" height="26" alt="pic"> 
</body> 

</html> 

  

原文地址:https://www.cnblogs.com/chenghu/p/3909933.html