jQuery触屏插件:Tap 代码
时间: 2023-09-08 12:08:48 浏览: 64
以下是一个简单的Tap插件的代码:
```
(function($) {
$.fn.tap = function(callback) {
var touchStartTime = 0;
var touchStartX = 0;
var touchStartY = 0;
var tapDelay = 200;
var tapDistanceThreshold = 10;
this.on('touchstart', function(e) {
touchStartTime = Date.now();
touchStartX = e.touches[0].clientX;
touchStartY = e.touches[0].clientY;
});
this.on('touchend', function(e) {
var touchEndTime = Date.now();
var touchEndX = e.changedTouches[0].clientX;
var touchEndY = e.changedTouches[0].clientY;
var touchDistance = Math.sqrt(Math.pow(touchEndX - touchStartX, 2) + Math.pow(touchEndY - touchStartY, 2));
if (touchEndTime - touchStartTime <= tapDelay && touchDistance <= tapDistanceThreshold) {
callback.call(this, e);
}
});
return this;
};
})(jQuery);
```
使用方法:
```
$('#element').tap(function() {
console.log('Tap event triggered!');
});
```
当用户在`#element`上单击并立即释放时,回调函数将被执行。这个插件还包括一个时间阈值和距离阈值来确定是否应该触发回调函数。