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> /// 鼠标事件 /// ...
随机推荐
- OC IOS屏幕分辨率
CGRect screenRect=[UIScreenmainScreen].bounds; CGSize screenSize=screenRect.size; //屏幕分辨率 screenSize ...
- LINQ（LINQ to DataSet）
http://www.cnblogs.com/SkySoot/archive/2012/08/21/2649471.html DataTable.Select()方法使用和 SQL 相似的过滤语法从 ...
- HTTPS（SSL）详解以及PHP调用方法
HTTPS 详解 1. 两个加密秘钥的概念 (1) 对称加密 即加密的秘钥和解密的秘钥一样 (2) 非对称加密 即加密的秘钥和解密的秘钥不一样, 分别称为公钥 和 私钥, 公钥完全公开 私钥解密者 ...
- 005. asp.net页面常用指令
页面指令 用于通知编译器在编译该页面时做出什么样的处理方式, 欢聚换来讲, 页面指令指定了执行该页面的运行时环境, 当编译器处理应用程序时, 可以通过这些指令来让编译器做特定的处理; 在asp.ne ...
- 【转】Win7注册表的使用（更新中）
一.注册表的存储结构和数据类型 1.基本概念: Windows 7的注册表主要由“键”和“键值”构成,称HKEY为根键(RootKey),SubKey为子键. 键(Key):“位于左侧窗格如同文件夹图 ...
- 关于getClass().getClassLoader()
关于getClass().getClassLoader() InputStream is = getClass().getClassLoader().getResourceAsStre ...
- Android 异步加载解决方案
Android的Lazy Load主要体现在网络数据(图片)异步加载.数据库查询.复杂业务逻辑处理以及费时任务操作导致的异步处理等方面.在介绍Android开发过程中,异步处理这个常见的技术问题之前, ...
- spring基础部分——注解
注解: @Entity @Table @Column @Enumerated @Autowired @Controller @RequestMapping @RequestParam
- windows 系统中打开一个数字证书所经历的过程
今天在使用Outlook express调试CSP程序时,发现数字证书总是加载不上(提示该数字证书已经被破坏),使用断点进去跟踪一下,发现在CSP程序中调用CPVerifySignature ...
- 06 Linux下Shell介绍
一.概述 每个人在成功登陆Linux后,系统会出现不同的提示符号,例如$,~,#等,然后你就可以开始输入需要的命令.若命令正确,系统就会依据命令的要求来执行,直到注销系统为止,在登陆到注销期间,输入的 ...