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事件的执行   这个事件  会阻止移动端的单击事件

  • 相关阅读:
    VS远程调试亲历
    IIS7.5 配置虚拟目录的经历
    IE 兼容一问题一小记
    寻找 IBatisNet 批量插入(批量复制) 的心路历程
    Linq 多连接及 left join 实例 记录
    easyui treegrid idField 所在属性中值有花括号(如Guid)当有鼠标事件时会报错,行记录一下
    HDU1754
    HDU1166
    线段树模板
    HDU1599(Floyd最小环)
  • 原文地址:https://www.cnblogs.com/enych/p/11711649.html
Copyright © 2011-2022 走看看