欧美bbbwbbbw肥妇,免费乱码人妻系列日韩,一级黄片

js鼠標(biāo)按鍵事件和鍵盤(pán)按鍵事件用法實(shí)例匯總

 更新時(shí)間:2016年10月03日 11:02:11   作者:kp12345  
這篇文章主要介紹了js鼠標(biāo)按鍵事件和鍵盤(pán)按鍵事件用法,結(jié)合實(shí)例形式總結(jié)分析了JavaScript針對(duì)鼠標(biāo)與鍵盤(pán)事件的常用操作技巧,需要的朋友可以參考下

本文實(shí)例講述了js鼠標(biāo)按鍵事件和鍵盤(pán)按鍵事件用法。分享給大家供大家參考,具體如下:

keydown,keyup,keypress:屬于你的鍵盤(pán)按鍵

mousedown,mouseup:屬于你的鼠標(biāo)按鍵

當(dāng)按鈕被按下時(shí),發(fā)生 keydown 事件,

keyup是在用戶(hù)將按鍵抬起的時(shí)候才會(huì)觸發(fā)的,

完整的 key press 過(guò)程分為兩個(gè)部分:1. 按鍵被按下;2. 按鍵被松開(kāi)。

當(dāng)用戶(hù)在這個(gè)元素上按下鼠標(biāo)鍵的時(shí)候,發(fā)生mousedown

當(dāng)用戶(hù)在這個(gè)元素上松開(kāi)鼠標(biāo)鍵的時(shí)候,發(fā)生mouseup

例子

1. 鼠標(biāo)的哪個(gè)按鍵被點(diǎn)擊

<html>
<head>
<script type="text/javascript">
function whichButton(event)
{
if (event.button==2)
{
alert("你點(diǎn)擊了鼠標(biāo)右鍵!")
}
else
{
alert("你點(diǎn)擊了鼠標(biāo)左鍵!")
}
}
</script>
</head>
<body onmousedown="whichButton(event)">
<p>請(qǐng)單擊你鼠標(biāo)的左鍵或右鍵試試</p>
</body>
</html>

2. 當(dāng)前鼠標(biāo)的光標(biāo)坐標(biāo)是多少

<html>
<head>
<script type="text/javascript">
function show_coords(event)
{
x=event.clientX
y=event.clientY
alert("X 坐標(biāo): " + x + ", Y 坐標(biāo): " + y)
}
</script>
</head>
<body onmousedown="show_coords(event)">
<p>在此文檔中按下你鼠標(biāo)的左鍵看看!</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án)上的某個(gè)鍵看看</p>
</body>
</html>

4. 當(dāng)前鼠標(biāo)的光標(biāo)相對(duì)于屏幕的坐標(biāo)是多少

<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>
點(diǎn)擊你鼠標(biāo)的左鍵
</p>
</body>
</html>

5. 當(dāng)前鼠標(biāo)的光標(biāo)坐標(biāo)是多少

<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>
點(diǎn)擊你鼠標(biāo)的左鍵
</p>
</body>
</html>

6. shift鍵是否按下

<html>
<head>
<script type="text/javascript">
function isKeyPressed(event)
{
if (event.shiftKey==1)
{
alert("shit鍵按下了!")
}
else
{
alert("shit鍵沒(méi)有按下!")
}
}
</script>
</head>
<body onmousedown="isKeyPressed(event)">
<p>按下shit鍵,點(diǎn)擊你鼠標(biāo)的左鍵</p>
</body>
</html>

7. 當(dāng)前被點(diǎn)擊的是哪一個(gè)元素

<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("你點(diǎn)擊了 " + tname + "元素")
}
</script>
</head>
<body onmousedown="whichElement(event)">
<p>在這里點(diǎn)擊看看,這里是p</p>
<h3>或者點(diǎn)擊這里也可以呀,這里是h3</h3>
<p>你想點(diǎn)我嗎??</p>
<img border="0" src="../myCode/btn.gif" width="100" height="26" alt="pic">
</body>
</html>

PS:這里再為大家提供一個(gè)關(guān)于JS事件的在線(xiàn)工具,歸納總結(jié)了JS常用的事件類(lèi)型與函數(shù)功能:

javascript事件與功能說(shuō)明大全:

http://tools.jb51.net/table/javascript_event

更多關(guān)于JavaScript相關(guān)內(nèi)容感興趣的讀者可查看本站專(zhuān)題:《JavaScript窗口操作與技巧匯總》、《JavaScript中json操作技巧總結(jié)》、《JavaScript切換特效與技巧總結(jié)》、《JavaScript查找算法技巧總結(jié)》、《JavaScript動(dòng)畫(huà)特效與技巧匯總》、《JavaScript錯(cuò)誤與調(diào)試技巧總結(jié)》、《JavaScript數(shù)據(jù)結(jié)構(gòu)與算法技巧總結(jié)》、《JavaScript遍歷算法與技巧總結(jié)》及《JavaScript數(shù)學(xué)運(yùn)算用法總結(jié)

希望本文所述對(duì)大家JavaScript程序設(shè)計(jì)有所幫助。

相關(guān)文章

最新評(píng)論