【JavaScript】window对象_event事件对象

简介:
1.event对象属性
event对象可以获取和设置当前事件的有关信息,比如,
获取发生事件的事件源对象,像键盘按下时使用的是哪
个按键,鼠标事件发生时的鼠标位置,以及按下的鼠标
按键是哪个。

主要属性:
altKey属性:用于检测事件发生时,alt键是否被按下(true/false)。

ctrlKey属性:用于检测事件发生时,ctrl键是否被按下(true/false)。

shiftKey属性:用于检测事件发生时,shift键是否被按下(true/false)。

clientX、clientY属性:用于设置和返回鼠标相对窗口客户区顶点的
x,y坐标。所谓窗口客户区,也就是窗口的有效工作区,因为网页上的
内容不可能显示在边框上,所以窗口的有效工作区就是不包含边框和
滚动条的区域。

screenX、screenY属性:用于设置和返回鼠标相对屏幕顶点的x,y坐标。

offsetX、offsetY属性用于设置和返回鼠标相对事件源的x,y坐标。
例如发生事件的按钮的顶点的的x,y坐标。

x、y属性:用于设置和返回鼠标相对事件源的父元素的顶点的x,y坐标。


returnValue属性:用于设置和返回事件的返回值,以便浏览器判断是否
继续对当前事件按照默认的方式来进行处理。一般情况下将这个属性值设
为false,浏览器就会使用默认方式进行处理。

cancelBubble属性:用于设置和返回当前事件是否继续向下传递,例如
单击文档中的图片,在默认情况下,在图片对象上发生onclink事件,
然后在窗口对象上也发生了onclik事件,就相当于"多米诺骨牌"。
cancelBubble=true就不会让事件继续向下传递。

srcElement属性:用于设置和返回发生当前事件的事件源对象。

keyCode属性:用于设置和返回键盘按下和弹起的那个按键的unicode码值。

例子:用户按键盘上任何键,都会返回这个按键的unicode码
<script>
    function window_onkeypress()
    {
        alert(window.event.keyCode);
    }
</script>
<body onkeypress="window_onkeypress()">
</body>

按下ESC键关闭浏览器文档窗口
if(window.event.keyCode==27)
{
    window.close();
}

出现一个是否关闭对话框的按钮,而没有直接关闭对话框,
原因是window对像的close方法,只能够直接关闭window
对象的open方法打开的子窗口,而不能直接关闭浏览器程
序本身启动的窗口。

button属性:用于检索鼠标移动、鼠标抬起,鼠标按下时
按下的是哪个鼠标按键。1代表做按键,2代表左按键,3代
表左右按键同时按下或抬起。如果是3个键的鼠标,button
属性还有其他的方法,可以在帮助文档中查看到。

鼠标按键测试代码:
<script>
    function window_onbuttonpress()
    {
        alert(window.event.button);
    }
</script>
<body onmousedown="window_onbuttonpress()">
</body>

综合测试:按图片会弹出图片的存储路径,
但是按住shift键之后再按图片就不会弹出

<script language="javascript">
function checkCancel()
{
   if(window.event.shiftKey)
   {
        window.event.cancelBubble=true;//cancelBubble前面提到过
   }
}
function showSrc()
{
    //返回最早触发这个事件的事件源对象
    //(必须大写,或者前面加"toLowerCase()")
    if(window.event.srcElement.tagName=="IMG")
     alert(window.event.srcElement.src);
}
</script>
<body onclick="showSrc()">
<img onclick="checkCancel()" src="sample.gif">
</body>

转载请注明出处:http://blog.csdn.net/acmman/article/details/44126747

相关文章
|
15天前
|
JavaScript
JS 获取对象数据类型的键值对的键与值
JS 获取对象数据类型的键值对的键与值
|
24天前
|
JavaScript 前端开发
Math对象:JavaScript中的数学工具
Math对象:JavaScript中的数学工具
27 1
N..
|
1月前
|
存储 JavaScript 前端开发
JavaScript中的对象
JavaScript中的对象
N..
10 0
|
1月前
|
JavaScript 前端开发
JavaScript对象系列(菜菜出品,必看!!!)
JavaScript对象系列(菜菜出品,必看!!!)
|
2月前
|
JavaScript 前端开发
JS将两个数组和合并成数组包对象格式的方法
JS将两个数组和合并成数组包对象格式的方法
28 0
|
18天前
|
JavaScript 算法
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
原生JS完成“一对一、一对多”矩形DIV碰撞检测、碰撞检查,通过计算接触面积(重叠覆盖面积)大小来判断接触对象DOM
|
1月前
|
存储 JavaScript 前端开发
在JavaScript中,对象和数组是如何进行扩展的?
在JavaScript中,对象和数组是如何进行扩展的?
22 4
|
2天前
|
存储 JavaScript 索引
js开发:请解释什么是ES6的Map和Set,以及它们与普通对象和数组的区别。
ES6引入了Map和Set数据结构。Map的键可以是任意类型且有序,与对象的字符串或符号键不同;Set存储唯一值,无重复。两者皆可迭代,支持for...of循环。Map有get、set、has、delete等方法,Set有add、delete、has方法。示例展示了Map和Set的基本操作。
16 3
|
4天前
|
JavaScript 前端开发 开发者
JavaScript中的错误处理:try-catch语句与错误对象
【4月更文挑战第22天】JavaScript中的错误处理通过try-catch语句和错误对象实现。try块包含可能抛出异常的代码,catch块捕获并处理错误,finally块则无论是否出错都会执行。错误对象提供关于错误的详细信息,如类型、消息和堆栈。常见的错误类型包括RangeError、ReferenceError等。最佳实践包括及时捕获错误、提供有用信息、不忽略错误、利用堆栈信息和避免在finally块中抛错。
|
10天前
|
JavaScript
【Js】检查Date对象是否为Invalid Date
【Js】检查Date对象是否为Invalid Date
14 0