js鼠标事件、键盘事件实例代码
讲述了：鼠标的哪个按键被点击、当前鼠标的光标坐标是多少、被按下键的unicode码是多少、当前鼠标的光标相对于屏幕的坐标是多少、当前鼠标的光标坐标是多少、shift键是否按下、当前被点击的是哪一个元素
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>
js鼠标事件、键盘事件实例代码的更多相关文章
- js 鼠标和键盘事件
js 鼠标和键盘事件 鼠标事件 聚焦事件 离焦事件 鼠标单击和双击 鼠标的其他事件 鼠标事件对象 键盘事件 鼠标事件 聚焦事件 <input type="text" id=& ...
- JS 鼠标、键盘事件对象
鼠标事件对象 mouseEvent鼠标事件对象 e.clientX 在可视区的x和y的坐标 e.pageX 在页面文档的X和Y的坐标 <script> docume ...
- js鼠标、键盘事件实例代码
1. 鼠标的哪个按键被点击? <html> <head> <script type="text/javascript"> function wh ...
- Selenium WebDriver 中鼠标和键盘事件分析及扩展(转)
本文将总结 Selenium WebDriver 中的一些鼠标和键盘事件的使用,以及组合键的使用,并且将介绍 WebDriver 中没有实现的键盘事件(Keys 枚举中没有列举的按键)的扩展.举例说明 ...
- C#/winform 自动触发鼠标、键盘事件
要在C#程序中触发鼠标.键盘事件必须要调用windows函数. 一.鼠标事件的触发 1.引用windows函数mouse_event /// <summary> /// 鼠标事件 /// ...
- HTML5 Canvas鼠标与键盘事件
演示HTML5 Canvas鼠标事件,获取Canvas对象上的鼠标坐标,演示键盘事件 通过键盘控制Canvas上对象移动. Canvas对象支持所有的JavaScript的鼠标事件,包括鼠标点击(Mo ...
- lufylegend库 鼠标事件 循环事件 键盘事件
lufylegend库 鼠标事件 循环事件 键盘事件 <!DOCTYPE html> <html lang="en"> <head> <m ...
- OSX 鼠标和键盘事件
本文转自:http://www.macdev.io/ebook/event.html 事件分发过程 OSX 与用户交互的主要外设是鼠标,键盘.鼠标键盘的活动会产生底层系统事件.这个事件首先传递到IOK ...
- JavaScript事件基础-10-2.HTML事件; DOM0级事件; 掌握常用的鼠标与键盘事件 ; 掌握this的指向;
JavaScript事件基础 学习目标 1.掌握什么是事件 2.掌握HTML事件 3.掌握DOM0级事件 4.掌握常用的鼠标与键盘事件 5.掌握this的指向 什么是事件 事件就是文档或浏览器窗口中发 ...
- C# 自动触发鼠标、键盘事件
要在C#程序中触发鼠标.键盘事件必须要调用windows函数. 一.鼠标事件的触发 1.引用windows函数mouse_event /// <summary> /// 鼠标事件 /// ...
随机推荐
- Redis 源码解析
http://programmers.stackexchange.com/questions/49550/which-hashing-algorithm-is-best-for-uniqueness- ...
- jsonp 跨域原理详解
JavaScript是一种在Web开发中经常使用的前端动态脚本技术.在JavaScript中,有一个很重要的安全性限制,被称为“Same-Origin Policy”(同源策略).这一策略对于Java ...
- Entity Framework 全面教程详解（转）
目录 预备知识 2 LINQ技术 2 LINQ技术的基础 - C#3.0 2 自动属性 2 隐式类型 2 对象初始化器与集合初始化器 3 匿名类 3 扩展方法 ...
- C# 大于屏幕的窗体
1.使用SetWindowPos就可以做到这一点,只是最后一个参数要选对. RECT windowRect = new RECT(); User32.GetWindowRect(MyForm2.Han ...
- 使用Myeclipse 2015 进行 Hdp 4 windows 开发
在本地环境下进行开发,使用cygwin安装 Hdp那就是一个呵呵岂能概括. 所以啊,还是用Hdp windows进行开发测试吧.这样感觉省心点.具体 Hdp windows的安装参看前面的文章或自行G ...
- （委托事件处理）关于多线程执行显示进度条的实例（转）&&线程间操作无效: 从不是创建控件“rtxtEntryNO”的线程访问它。
关于多线程执行显示进度条的实例! 之前回答了一篇关于怎么在线程中操作进度条的帖子,估计有人看的不是很明白今天没事,写了一个小小的实例,很简单,就2个文件权当抛砖引玉,希望有更好解决方案的人发表一下意见 ...
- java编辑器eclipse如何更改jdk版本
第一步:右键点击项目选择properties 第二步:选择Java Build Path 第三步:选择libraries 第四步:选中当前jre再点击右侧Edit 第五步: ...
- Oracle获取AWR和ASH
-- 找到指定的snap select snap_id, max(sample_time) from sys.wrh$_active_session_history group by snap_id ...
- [navicat] Navicat for Oracle Cannot load OCI DLL
1. 本地安装的是64位的Oracle,但由于Navicat仅支持32位的,因此我们还需下载一个32位的客户端. 2.
- java.io.IOException: ORA-22920: 未锁定含有 LOB 值的行
究其原因是因为没有锁定要更新的行记录.将 mysql="select filebody from filelist where filename=?"中的SQL语句加上 ...