问答博客资讯标签用户活动
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
    2921
    新手上路，请多包涵

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

    前端javascriptvue3
    阅读 1.5k
    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>
      撰写回答
      你尚未登录，登录后可以
      • 和开发者交流问题的细节
      • 关注并接收问题和回答的更新提醒
      • 参与内容的编辑和改进，让解决方法与时俱进
      推荐问题