js-event(事件对象及其属性、方法)

zccst整理


2014-10-21

Event 对象
Event 对象代表事件的状态,比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。
事件通常与函数结合使用,函数不会在事件发生前被执行!

其中:event.target不支持IE浏览器。


1,事件句柄(事件函数):以on开头的若干
2,鼠标/键盘属性:
[img]http://dl2.iteye.com/upload/attachment/0102/2706/3c24f683-bcde-357b-a1ed-e6f3c57fd028.jpg[/img]

3,
[img]http://dl2.iteye.com/upload/attachment/0102/2708/42772192-f493-35ee-8c82-e01adb018d44.jpg[/img]


[b]二,[/b]

<div class="opt_group">
<label title="标签1"><input type="radio" value="label1" name="page_type" />标签1 <label>
<label title="标签2"><input type="radio" value="label2" name="page_type" />标签2 <label>
</div>


$(".opt_group label").click(function(e){
var $target = e.target;//firefox 下的 event.target = IE 下的 event.srcElement
var val = $target.val();//
console.log(e.target.nodeName,e.target,$(e.target));
});
/*
触发两次,一次是label,一次input。
*/

截图:
[img]http://dl2.iteye.com/upload/attachment/0092/0557/34fd22fa-fb3f-3c19-9121-7412ef00ccda.jpg[/img]


[b]一,Js event事件在IE、FF兼容性问题[/b]
1,event对象
IE:有window.event对象
FF:没有window.event对象。可以通过给函数的参数传递event对象。
如:
<input type="button" οnmοusemοve="showDiv(event);"//event不需要加引号
function showDiv(event)
{
var event=window.event||event;
event.clientX;
event.clientY;
}

2,event.srcElement||event.target
Javascript event.srcElement
感觉这个挺好,可以捕获当前事件作用的对象,如event.srcElement.tagName可以捕获活动标记名称。
注意获取的标记都以大写表示,如"TD","TR","A"等。所以把看过的一些抄下来,不记得的时候再来看看。

event.srcElement从字面上可以看出来有以下关键字:事件,源 他的意思就是:当前事件的源,我们可以调用他的各种属性 就像:document.getElementById("")这样的功能,经常有人问 firefox 下的 event.srcElement 怎么用,在此详细说明:

IE下,event对象有srcElement属性,但是没有target属性;Firefox下,event对象有target属性,但是没有srcElement属性.但他们的作用是相当的,即:firefox 下的 event.target = IE 下的 event.srcElement

解决方法:使用obj(obj = event.srcElement ? event.srcElement : event.target;)来代替IE下的event.srcElement或者Firefox下的event.target.
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值