1、对于<div οnclick="onClick()"></div>
在IE中:<div οnclick="onClick()"></div>
在FF中:<div οnclick="onClick(event)"></div> // 必须传递参数。且参数为:" event "
对应在js中,浏览器兼容考虑:
function onClick|(e) // 此处e为传递的参数
{
var e = e?e:window.event; // 获取事件对象
if(e.keyCode ==13){ // 获取键盘事件的对象,IE默认为window.event。其他浏览器需要写成event以参数传递。
alert(obj.value);
}
}
解释:
var e = e?e:window.event; // 获取事件对象,触发事件对象。
在IE中事件对象默认为window.event
在其他浏览器中,事件对象必须以参数传递
2、事件对象常用的属性和方法:
e.type // 返回click,mouseover等
e.Target || e.srcElement // 触发事件的目标元素
e.ctrlKey, e.altKey, e.shiftKey // 布尔值,判断按键
e.screenX, e.screenY // 事件触发时相对于屏幕的横坐标和竖坐标
4、阻止事件的默认行为
e.preventDefault() || e.returnVaule = false; // 阻止事件的默认行为,比如阻止连接跳转(再重新设置一个window.open()或链接)、阻止表单提交等
IE:e.trunValue = false;
非IE:e.preventDefault();
5、停止事件的传播
事件可以在各层级中传递,如冒泡和捕获。当事件在特定节点执行完后不再传递,使用事件对象的stopPropagation()方法。
e.stopPropagation() || e.cancelBubble = true;
IE:e.cancelBubble = true;
非IE:e.stopPropagation();
如:点击弹出层外的空白区域,隐藏弹出层。
但是由于事件的冒泡传递,点击弹出层本身:会一层层往上查找到最上层,触发最上层div的点击事件,隐藏弹出层。
显然是不希望点击弹出层,而隐藏弹出层本身的。
则,解决方法:
obj.onclick = function(e){
e.stopPropagation(); // IE8以后,弹出层obj 对jquery的live绑定的事件不起作用(待测试)
// e.cancelBubble = false; // IE8以前,弹出层obj
}
document.documentElement.onclick = function(e){ obj.style.display = "none";} // 点击空白区域,即documentElement节点
6、return false
return false; // 退出执行,return false之后的所有触发事件和动作都不会执行。退出循环。返回对象等。对jquery的live绑定事件起作用。
7、浏览器的默认动作:页面元素上带有的功能。如点击a节点链接的跳转,表单提交动作。