js有没有代码判断手机触摸屏上滑下滑左滑右滑事件检测?
网友回复
新建EventUtil.js,文件如下:
/**
* 用touch事件模拟点击、左滑、右滑、上拉、下拉等时间,
* 是利用touchstart和touchend两个事件发生的位置来确定是什么操作。
* 例如:
* 1、touchstart和touchend两个事件的位置基本一致,也就是没发生位移,那么可以确定用户是想点击按钮等。
* 2、touchend在touchstart正左侧,说明用户是向左滑动的。
* 利用上面的原理,可以模拟移动端的各类事件。
**/
const EventUtil = (function() {
//支持事件列表
let eventArr = ['eventswipeleft', 'eventswiperight', 'eventslideup', 'eventslidedown', 'eventclick', 'eventlongpress'];
//touchstart事件,delta记录开始触摸位置
function touchStart(event) {
this.delta = {};
this.delta.x = event.touches[0].pageX;
this.delta.y = event.touches[0].pageY;
this.delta.time = new Date().getTime();
}
/**
* touchend事件,计算两个事件之间的位移量
* 1、如果位移量很小或没有位移,看做点击事件
* 2、如果位移量较大,x大于y,可以看做平移,x>0,向右滑,反之向左滑。
* 3、如果位移量较大,x小于y,看做上下移动,y>0,向下滑,反之向上滑
* 这样就模拟的移动端几个常见的时间。
* */
function touchEnd(event) {
let delta = this.delta;
delete this.delta;
let timegap = new Date().getTime() - delta.time;
delta.x -= event.changedTouches[0].pageX;
delta.y -= event.changedTouches[0].pageY;
if (Math.abs(delta.x) < 5 && Math.abs(delta.y) < 5) {
if (timegap < 1000) {
if (this['eventclick']) {
this['eventclick'].map(function(fn){
fn(event);
});
}
} else {
if (this['eventlongpress']) {
this['eventlongpress'].map(function(fn){
fn(event);
});
}
}
return;
}
if (Math.abs(delta.x) > Math.abs(delta.y)) {
if (delta.x > 0) {
if (this['eventswipeleft']) {
this['eventswipeleft'].map(function(fn){
fn(event);
});
}
} else {
...点击查看剩余70%
python能写一个检测nginx rewrite高危漏洞的工具代码?
css如何给video视频进行mask遮罩?
windows如何同时允许两个用户远程桌面连接同一个电脑?
nginx升级到1.30.1导致无法启动 [emerg] SSL_CTX_new() failed怎么办?
什么是ASLR(地址随机化)?
有没有不依赖embedding向量的RAG技术?
有没有支持实时打断语音通话并后台帮你执行任何的ai模型?
开源ai大模型文件格式GGUF、MLX、Safetensors、 ONNX 有什么区别?
出海挣钱支付收款PayPal、Wise 、PingPong、Stripe如何选择?
如何实现类似google的图片隐形水印添加和识别技术?


