小程序 手机左滑右滑事件监听

<view class="touch" bindtouchstart="touchStart" bindtouchmove="touchMove" bindtouchend="touchEnd" ></view>


  // 触摸开始事件
  touchStart: function (e) {
    touchDot = e.touches[0].pageX; // 获取触摸时的原点
    // 使用js计时器记录时间
    interval = setInterval(function () {
      time++;
    }, 100);
  },
  // 触摸移动事件
  touchMove: function (e) {
    var touchMove = e.touches[0].pageX;
    console.log("touchMove:" + touchMove + " touchDot:" + touchDot + " diff:" + (touchMove - touchDot));
    // 向左滑动
    if (touchMove - touchDot <= -40 && time < 10) {
      // wx.switchTab({
      //   url: ‘../左滑页面/左滑页面‘
      // });
      console.log(213)
    }
    // 向右滑动
    if (touchMove - touchDot >= 40 && time < 10) {
      console.log(‘向右滑动‘);
      wx.switchTab({
        url: ‘pages/position_man/position_man‘
      });
      console.log(54645)
    }
  },
  // 触摸结束事件
  touchEnd: function (e) {
    clearInterval(interval); // 清除setInterval
    time = 0;
  }, 

原文地址:https://www.cnblogs.com/wangshishuai/p/11031420.html

时间: 2024-10-07 05:32:34

小程序 手机左滑右滑事件监听的相关文章

小程序实现左滑删除效果

小程序的左滑删除效果用的是组件 movable-area 和 movable-view 文档 : https://developers.weixin.qq.com/miniprogram/dev/component/movable-view.html 1.movable-area基本概念 (1)movable-area这个就是定义了一个移动的区域,跟普通的<view></view>的含义是一样的,不同在于,接着往下看: 注意:movable-area 必须设置width和heigh

IOS开发—视图控制器左边缘右滑pop出栈

IOS视图控制器左边缘右滑pop出栈 IOS7.0之后,苹果优化了一个小功能,就是对于UINavagationController堆栈里的UIViewController,只要轻轻在视图控制器的左边缘右滑一下,该视图控制器就会pop出栈(前提当然是对于非根视图控制器而言).实现方法很简单,一句话搞定: self.navigationController.interactivePopGestureRecognizer.enabled = YES; 事实上对于一个视图控制器而言,该属性的默认值即为Y

Android SwipeToDismiss:左滑/右滑删除ListView条目Item

?? <Android SwipeToDismiss:左右滑动删除ListView条目Item> Android的SwipeToDismiss是github上一个第三方开源框架(github上的项目链接地址:https://github.com/romannurik/Android-SwipeToDismiss ).该开源项目旨在:使得一个ListView的item在用户的手指在屏幕上左滑或者右滑时候,删除当前的这个ListView Item. 此种特效在新版的Android中应用不少.比方在

前端福利——左滑右滑,绝对是你见过的最简单的写法

上个月使用bootstrap和seajs搭建了前端通用框架,就是为了使代码分块话,js和css直接通过配置就可调用,这样既方便了以后的开发,又方便了效率! 先看下框架图形吧 example就是手机端经常用到的示例 今天就是把我写的左滑右滑分享给大家,先看下图例吧 index.html代码 引用三个js jquery.js swiperhand.js index.js <div id="pagenos"> <span class="myspan" i

微信小程序里解决app.js onLaunch事件与小程序页面的onLoad加载前后异常问题

使用 Promise 解决小程序页面因为需要app.js onLaunch 参数导致的请求失败 app.js onLaunch 的代码 1 "use strict"; 2 Object.defineProperty(exports, "__esModule", { 3 value: true 4 }); 5 const http = require('./utils/http.js'); 6 const api = require('./config.js'); 7

小程序跨页面数据传递与事件响应

在实际工作中有很多场景需要在第二个页面中将用户操作之后的将数据回传到上一页面.接下来将我的方案分享给小伙伴. 本次示例采用 uni-app 框架和 weui 样式库 实现思路 创建一个 Emitter,用于事件处理 创建一个 ... 在实际工作中有很多场景需要在第二个页面中将用户操作之后的将数据回传到上一页面.接下来将我的方案分享给小伙伴. 本次示例采用 uni-app 框架和 weui 样式库 实现思路 创建一个 Emitter,用于事件处理 创建一个全局的 Storage 在第一个页面创建一

Windows 8 应用程序前后台切换事件监听

在一些情况下,我们需要监听应用程序切换到后台或者从后台切换至前台的事件,从而进行相关处理操作.支付宝应用锁屏(IOS,Android平台)的处理中就需要监听此事件,在用户将应用切换至后台一段时间后再切换至前台的情况下就需要弹出锁屏页面. 下图给出Windows 应用商店应用的生命周期图,应用前后台切换就是在运行和挂起直接进行切换,关于生命周期的详细介绍可以参阅官方文档:http://msdn.microsoft.com/zh-cn/library/windows/apps/hh464925.as

java 事件监听 - 键盘

//事件监听 //键盘事件监听,写了一个小案例,按上下左右,改变圆形的位置,圆形可以移动 import java.awt.*; import javax.swing.*; import java.awt.event.*; public class Index extends JFrame{ //设置面板 Wdmb wdmb = new Wdmb(); public static void main(String[] args) throws Exception{ //实例化当前类 Index i

cocos2d-x 事件分发机制 ——加速计事件监听

加速计事件监听机制 在上一篇中介绍了cocos2d-x中的触摸事件机制,这篇来介绍下游戏中也经常用到的加速计事件,这些都是游戏中的经常要用到的. 移动设备上一个很重要的输入源是设备的方向,大多数设备都配备了加速计,用于测量设备静止或匀速运动时所受到的重力方向. 重力感应来自移动设备的加速计,通常支持X.Y和Z三个方向的加速度感应,又称为三向加速计.实际应用中,可以根据三个方向的力度大小来计算手机倾斜的角度和方向. 3.0机制中,我们只需要创建一个加速计监听器EventListenerAccele