zoukankan      html  css  js  c++  java
  • js 触摸事件

    var jc = 0;
    document.addEventListener('touchstart', function(event) {
        jc=0;
    }, false);
    document.addEventListener('touchmove', function(event) {
        jc++;
    }, false);
    document.addEventListener('touchend', function(event) {
        console.log(jc);
        if(jc>10)
        {
            alert("测试");
        }
        event.preventDefault(); //阻止click事件的执行
    }, false);
    
    document.addEventListener('click', function(event) {
      console.log('click');
    }, false);
    触摸事件
    目前Safari 只支持TouchEvent(触摸事件)和GestureEvent(手势事件)
    TouchEvent
    {
        Touchstart
        Touchmove
        Touchend
        Touchcance
    }
    单击会触发
        1.TouchStart (开始)
        2.TouchEnd (结束)
        3.Click (点击)
    左滑动和右滑动
        1.TouchStart (开始)
        2.TouchMove(移动) 触发事件次数(++)
    3.TouchEnd (结束)

    出处:https://www.cnblogs.com/strick/p/5155042.html

      var jc = 0;
            var begin_x = 0; //开始坐标
            var end_x = 0; //结束坐标
            document.addEventListener('touchstart', function (event) {
                begin_x = event.touches[0].clientX;
                jc = 0;
            }, false);
            document.addEventListener('touchmove', function (event) {
                jc++;
                end_x = event.touches[0].clientX;
            }, false);
            document.addEventListener('touchend', function (event) {
                //var t = event.touches[0].screenX; //结束时候没有 touches数组长度为0;
                //console.log("end");
                //console.log(t);
                //console.log(jc);
                if (jc > 7) {
                    if (begin_x > end_x) {
                        alert("左滑动");
                    } else {
                        alert("右滑动");
                    }
                    //window.location = "/home/Seeview";
                }
                event.preventDefault(); //阻止click事件的执行
            }, false);

        //event.preventDefault(); //阻止click事件的执行   这个事件  会阻止移动端的单击事件

  • 相关阅读:
    css--之初级
    html之2
    前端之Html初学
    前端之http协议
    Jmeter连接SqlServer数据库进行压力测试
    web基础知识学习点
    monkeyrunner下登录app
    monkeyrunner下安装app,运行主页
    monkey测试小记
    windows下MonkeyRunner环境搭建
  • 原文地址:https://www.cnblogs.com/enych/p/11711649.html
Copyright © 2011-2022 走看看