手机端js长按事件

最新推荐文章于 2022-11-29 20:05:55 发布

wangpaofu

最新推荐文章于 2022-11-29 20:05:55 发布

阅读量1.3k

点赞数

分类专栏： js 文章标签： js 长按事件

js 专栏收录该内容

5 篇文章 0 订阅

订阅专栏

作用范围：手机端
作用内容：实现长按事件

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8"/>
    <title>Title</title>
</head>
<script src="../js/jquery-1.8.3.min.js"></script>

<body>
<button style="height: 1000px;width: 1000px" id="target">点击</button>
</body>
<script>
    $(function () {
        $("#target").on({
            touchstart: function (e) {
                // 长按事件触发
                timeOutEvent = setTimeout(function () {
                    timeOutEvent = 0;
                    alert('你长按了');
                }, 400);
                //长按400毫秒
            },
            touchmove: function () {
                clearTimeout(timeOutEvent);
                timeOutEvent = 0;
            },
            touchend: function () {
                clearTimeout(timeOutEvent);
                if (timeOutEvent != 0) {
                    // 点击事件
                    alert('你点击了');
                }
                return false;
            }
        })
    })

</script>
</html>