HTML5 自定义点击事件

最新推荐文章于 2022-03-10 09:41:17 发布

weixin_33929309

最新推荐文章于 2022-03-10 09:41:17 发布

阅读量733

点赞数

文章标签：移动开发

        /* 封装的TAP事件 */
        (function () {
            /**
             * IOS 和 PC 端 只需要创建一次就能一直使用
             * Android 手机 每次使用的时候都需要从新创建
             */
            function createEvent() {
                var myEvent = document.createEvent("HTMLEvents");
                myEvent.initEvent("tap", true, true);
                return myEvent;
            }
            var oldTime = null, newTime = null;
            var startx, starty, endx, endy;
            document.addEventListener("touchstart", function (ev) {
                ev = ev || event;
                oldTime = new Date().getTime();
                startx = ev.changedTouches[0].clientX;
                starty = ev.changedTouches[0].clientY;
            });
            document.addEventListener("touchend", function (ev) {
                ev = ev || event;
                newTime = new Date().getTime();
                endx = ev.changedTouches[0].clientX;
                endy = ev.changedTouches[0].clientY;
                if(newTime - oldTime > 300) return;
                if(Math.abs(startx - endx) > 10 || (Math.abs(starty - endy)) > 10) return;
                ev.target.dispatchEvent(createEvent());
            });
        })();