event的属性

t获取鼠标相对于浏览器左上角的坐标

<div id="dv" style=" width:300px; height:200px; background-color: Blue;">

<script type="text/javascript">
        window.onload = function () {
            document.getElementById(‘dv‘).onmousedown = function () {
                //相对于页面的左上角0的位置的坐标,不是层的0,0开始
                if (arguments.length > 0) {
                    //火狐浏览器
                    document.title = arguments[0].clientX + ‘====‘ + arguments[0].clientY;
                } else {
                    //IE浏览器
                    document.title = window.event.clientX + ‘====‘ + window.event.clientY;
                }
            };
        };
    </script>

获取用户按下的键

<div id="dv" style=" width:300px; height:200px; background-color: Orange;">

<script type="text/javascript">

        window.onload = function () {

            document.getElementById(‘dv‘).onclick = function () {

                //用户是否按下了ctrl键
                if (window.event.ctrlKey) {
                    alert(‘按下了ctrl键‘);
                } else if (window.event.shiftKey) {
                    alert(‘按下了shift键‘);
                } else if (window.event.altKey) {
                    alert(‘按下了alt键‘);
                } else {
                    alert(‘什么都没按下‘);
                }
                //用户是否按下了shift键

                //用户是否按下了alt键
            };

        };
    </script>

获取鼠标每个键的值

window.event.button; //左键是1,右键是2,左右同时是3,中滑轮是4

//获取的横坐标是相对屏幕左上角的 // document.title = window.event.screenX+‘===‘+window.event.screenY;

//当前这个元素的左上角--事件源 document.title = window.event.offsetX;

时间: 2024-10-15 12:04:47

event的属性的相关文章

jQuery Event.which 属性详解

jQuery Event.which 属性详解 which属性用于返回触发当前事件时按下的键盘按键或鼠标按钮. 对于键盘和鼠标事件,该属性用于确定你按下的是哪一个键盘按键或鼠标按钮. which属性对DOM原生的event.keyCode和event.charCode进行了标准化. 适用的事件类型主要有键盘事件:keypress.keydown.keyup,以及鼠标事件:mouseup.mousedown. 该属性属于jQuery的Event对象(实例). 语法 jQuery 1.1.3 新增该

前端程序员的蜕变——JS的 event 对象属性、使用实例、兼容性处理(极大提高代码效率、减少代码量)

下面讨论一下 js 中的 Event 对象,主要从以下三个方面详细的描述(点击标题可跳转到对应部分): 1.什么是event 2.怎么用event,用他该注意什么,几个简单实际应用 3.event在不同浏览器的存在的兼容问题,及如何去解决  1.  什么是event Event 对象代表事件的状态,比如事件在其中发生的元素.键盘按键的状态.鼠标的位置.鼠标按钮的状态等等.说的通俗一点就是,event是JS的一个系统内置对象.平时无法使用,当DOM元素发生按键.鼠标等等各种事件时,系统会自动根据D

键盘event.which属性

IE中,只有keyCode属性,而FireFox中有which和charCode属性 event.which属性对DOM原生的event.keyCode和event.charCode进行了标准化. function keypress(e){ e = e || window.event; var currKey = e.which || e.charCode || e.keyCode;var keyName = String.fromCharCode(currKey); console.log("

IE8中的Event对象属性与方法

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" con

Event对象——属性和方法

1.事件处理程序中返回false的效果: 事件处理程序   返回false的效果 click 单选按钮和复选按钮取消设置,对于submit按钮,表单提交被取消.对于reset按钮,表单不被重 置.对于链接,不装载链接目标 dragdrop 取消拖拽 keydown 在用户按住键不放时,取消随后的keypress事件 keypress 取消keypress事件 mousedown 取消默认行为(拖的开始.选择的开始.解除链接) mouseover 导致对window的status或defaultS

jquery中event对象属性与方法小结

JQuery事件中的Event属性是经常性的被忽略的.大多数时间你的确不怎么用它,但有些时候它还是它还是有作用的.如获知触发时用户的环境(是否按了shift etc).每个浏览器对event都有不同的地方,Jquery对Event做了标准化所以可以放心用. * .target  这个反应触发事件的DOM对象,可以在事件冒泡的时候判断是否是事件源头(compare event.target to this) * .pageX:  鼠标的left属性,相对于page * .pageY:  鼠标的to

jQuery Event.delegateTarget 属性详解

// 为id为element的元素中的所有span元素绑定click事件 $("#element").on( "click", "span", function(event){ // event.delegateTarget 就是id为element的DOM元素 // this 就是当前触发事件的span元素 alert( event.delegateTarget === this); // false } ); // 为id为element的元

better-scroll的用法,及其中的一个属性event._constructed详解

better-scroll是一个页面滚动插件,用它可以很方便的实现下拉刷新,锚点滚动等功能. 实现原理:父容器固定高度,并设置overflow:hidden,子元素超出父元素高度后将被隐藏,超出部分可滚动且没有滚动条. 立即使用: <body> <div id="wrapper"> <ul> <li>...</li> <li>...</li> ... </ul> </div> &

Event对象中的target属性和currentTarget属性的区别

先上结论: Event.target:触发事件的元素: Event.currentTarget:事件绑定的元素: 通过下面的例子来理解这两个属性的区别: 使用Event.target属性的例子:(我在<body>和<button>上都绑定了click事件) 1 <body onclick="mouseEvent1()"> 2 <button onclick="mouseEvent2()">点我</button&g