问答博客资讯标签用户活动
logo极客观点logo项目管理logoHarmonyOS
javascript
前端
python
node.js
react
vue.js
php
laravel
go
人工智能
mysql
linux
ios
java
android
css
typescript
spring
程序员
logoONES 研发管理logo思否企业问答logo安谋科技 XPU

如何在touchstart里面使用settimeout?

头像
j64prd5t
    2920
    新手上路，请多包涵

    我是想在web端实现一个长按的功能呢，里面需要在touchstart里面调用settimeout实现定时器的功能，但是这个在电脑上实现是可以的，手机上调用touchstart的时候，在touchstart里面写settimeout的函数，settimeout不执行，为什么？有大佬教下怎么在手机端实现长按功能吗?我是用vue3开发的。

    前端javascriptvue3
    阅读 1.4k
    1 个回答
    得票最新
    头像
    玛拉_以琳
      8.7k41542

      使用hammerjs库很方便: 官方文档
      他有onhold事件, 而且去除了移动端特有的300ms延时
      image.png

      <!DOCTYPE html>
<html>
<head>
    <meta name="viewport" content="width=device-width" />
    <title>Press</title>
    <script src="http://hammerjs.github.io/dist/hammer.min.js"></script>
    <style type="text/css">
        html, body {
            width: 100%;
            height: 100%;
            margin: 0px;
            padding: 0px;
        }

        .test {
            width: 100%;
            height: 50%;
            background: #ffd800;
            text-align: left;
        }

        .result {
            width: 100%;
            height: 50%;
            background: #b6ff00;
            text-align: left;
        }
    </style>
</head>
<body>
    <div id="test" class="test">事件区域</div>
    <div id="result" class="result">事件结果：按压超过500ms触发<br /></div>
    <script type="text/javascript">
        //创建一个新的hammer对象并且在初始化时指定要处理的dom元素
        var hammertime = new Hammer(document.getElementById("test"));
        //添加事件
        hammertime.on("press", function (e) {
            document.getElementById("result").innerHTML += "超过500ms了<br />";
            //控制台输出
            console.log(e);
        });
    </script>
</body>
</html>
      撰写回答
      你尚未登录，登录后可以
      • 和开发者交流问题的细节
      • 关注并接收问题和回答的更新提醒
      • 参与内容的编辑和改进，让解决方法与时俱进
      推荐问题