Biegral Blog

在JavaScript交互中，事件起着举足轻重的作用，在Mobile下，事件处理是怎么工作的呢？这篇文章主要讲述一些HTML事件的兼容情况，下一篇会着重讲解触摸事件的事件类型。

添加事件

我们可以通过以下几种方式来添加事件监听，

HTML方式，onclick="alert('simple')" JavaScript对象属性方式， element.onclick = function(){} Dom addEventListener

这几种方式在不同浏览器下的兼容情况，

load、beforeunload和unload事件

虽然onload事件可以注册在任何一个html元素上，但是，我建议只用在body元素上，因为其他元素的兼容性并没有得到有效的测试。 onunload事件，我也建议只注册在body元素上以来监听用户何时离开页面。在现在浏览器上，onunload事件有时并不是很有效， 很多人会使用onbeforeunload事件来提示用户正在离开页面，但是需要注意的是，onbeforeunload事件并不是一个标准事件，

click事件

click事件在大部分高端机器上是可以生效的，但是需要注意的是，它会有300-500ms的延迟，

focusable和form事件

mouseover和mouseout事件

mouseover和mouseout事件一般用来实现hover的效果，在基于touch事件的无线设备上 一般不会起作用，在现在浏览器不建议用over事件来实现hover效果，可以使用css的伪类:hover来实现， 在ios下，我们可以通过把一个元素变成clickable，来支持over事件，如下所示，

<span onmouseover = "..." onmouseout = "..." onclick = "void(0)"></span>

我们通过为元素添加一个onclick = "void(0)"句柄来让浏览器把span元素识别为clickable的元素

scrolling, resizing和rientation事件

当浏览器窗口大小改变的时候，onresize事件会被触发，用户没办法在mobile设备上像在pc上那样自由 的调整窗口大小，但是当用户旋转设备的时候会触发onorientation/onresize事件

key事件

key事件主要包括onkeypress, onkeyup,和onkeydown