JAVASCRIPT GULP
如何解决移动端的点击事件?

本来点击事件不应该成为一个问题,但是很可惜的是,在移动端的浏览器中,click事件有300ms左右的响应延迟,因此为了更好的用户体验便不能直接在移动端使用click为元素添加点击事件。

zepto.js为了解决这个问题,为我们提供了tap[轻击]来替换click,可是用了一段时间之后,发现tap事件存在一个点透问题,即能够触发元素下一层的点击事件,而使得该方案也变得问题多多。

好在目前也有许多的解决方案,让这个简单但是一波三折的问题得到了解决。

1、 在移动端使用touchend事件代替click事件,使用方式如下

var clickEvent = 'ontouchend' in document ? 'touchend' : 'click';
$(ele).on(clickEvent, function(event) {
    // 如果在移动端,一定要记得阻止默认事件
    event.preventDefault();
    // do something
})

2、 使用fastclick.js,点击可在github上查看详情

在jQuery/zepto中,用如下方式使用即可

(function($, undefined) {
    FastClick.attach(document.body);

    // 然后就可以直接绑定click事件了
    $(ele).click(function() {
        // do something
    });
})(Zepto);