百度touch.js：Web移动端touch点击事件解决方案

• Z时代
• 2024-01-10
• 分类：技术分享

百度touch.js

touch.js" title="百度touch.js">百度touch.js可以说是Web移动端touch点击事件不错的解决方案，搭配zepto.js或者jQuery使用起来解决了移动端click点击事件300ms的延迟问题。

近期touch.js百度官方网站突然无法访问了，不知道到底是什么原因。官网地址：http://touch.code.baidu.com/

不过值得庆幸的是，百度官方在Clouda项目的文档说明中还有留有关于touch.js的说明文档，详见：http://cloudajs.org/docs/step4_API_Documentation#h2_7

不过touch.js上手还是很容易的，语法：

touch.on('#btn-ok','tap',function(ev){

 

//这里是你想要执行的操作，随便写

})

上面是一个简单的tap操作，touch.js还支持滑动、缩放等等手势操作，详细的手势事件如下：

touch.js支持的手势事件类型：

事件代理

touch.on( delegateElement, types, selector, callback );

功能描述：

事件代理方法。

参数描述：

事件配置

touch.config(config)

功能描述：

对手势事件库进行全局配置。

参数描述：

config为一个对象

{
    tap: true,                  //tap类事件开关, 默认为true
    doubleTap: true,            //doubleTap事件开关， 默认为true
    hold: true,                 //hold事件开关, 默认为true
    holdTime: 650,              //hold时间长度
    swipe: true,                //swipe事件开关
    swipeTime: 300,             //触发swipe事件的最大时长
    swipeMinDistance: 18,       //swipe移动最小距离
    swipeFactor: 5,             //加速因子, 值越大变化速率越快
    drag: true,                 //drag事件开关
    pinch: true,                //pinch类事件开关
}

**

事件对象

**

事件处理函数的第一个参数为事件对象，除了原生属性之外，百度手势库还提供了部分新属性。

以下为手势新增的属性：

事件绑定

touch.on( element, types, callback );

功能描述：

事件绑定方法，根据参数区分事件绑定和事件代理。

参数描述：

解除事件代理

touch.off( delegateElement, types, selector, callback )

功能描述：

解除某元素上的事件代理。

参数描述：

解除事件绑定

touch.off( element, types, callback )

功能描述：

解除某元素上的事件绑定，根据参数区分事件绑定和事件代理。

参数描述：

触发事件

touch.trigger(element, type);

功能描述：

触发某个元素上的某事件。

参数描述：

以上是 百度touch.js：Web移动端touch点击事件解决方案 的全部内容， 来源链接： utcz.com/a/263.html