关于鼠标、键盘的几个事件的例子

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

</html>

posted @ 2010-10-27 16:28  与时俱进  阅读(361)  评论(0编辑  收藏  举报
友情链接:同里老宅院民居客栈