美文网首页
去除点击事件300ms延迟 (使用了vue之后)

去除点击事件300ms延迟 (使用了vue之后)

作者: xilong | 来源:发表于2018-04-23 10:53 被阅读2075次

    因为习惯用vue了,再回到以前 采用获取dom节点来操作的写法 就觉得很麻烦。
    我在 click 事件里面加了 tapmode 属性,在安卓里面没有300ms的延迟,但是在ios里面就会有这个问题.
    看了很多解释,说是tapmode 只能和 onclick放在一起,像vue里面的 @click就不行。
    就在论坛里面找各种方法,用了fastclick.js也没有效果(不知道是不是我用的方法没对)

    解决办法

    只需要在div上这样写 (就可以消除 安卓 和 ios click事件300ms延迟)

    <div tapmode onclick="app.clickFn()"></div>
    

    下面是完整代码片段

    <!DOCTYPE HTML>
    <html>
    
    <head>
        <meta charset="utf-8">
        <meta name="viewport" content="maximum-scale=1.0, minimum-scale=1.0, user-scalable=0, initial-scale=1.0, width=device-width" />
        <meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
        <title>素影</title>
        <link rel="stylesheet" type="text/css" href="../../css/api.css" />
        <link rel="stylesheet" type="text/css" href="../../css/common.css" />   //公共css
        <style type="text/css"></style>
    </head>
    <body>
        <div id='app'>
            <div class="app-div" tapmode onclick="app.clickFn()"></div>
        </div>
    </body>
    <script type="text/javascript" src="../../script/vue.js"></script>       //引入vue
    <script type="text/javascript" src="../../script/api.js"></script>
    <script type="text/javascript" src="../../script/commonjs.js"></script>    //引入公共js
    <script type="text/javascript">
        var app = new Vue({
            el: '#app',
            data: {},
            methods: {
                clickFn:function () {
                     //do something
                },
             },
            mounted:function() {
                apiready = function(){
                    //初始化
                };
             }
        })
    </script>
    </html>
    

    相关文章

      网友评论

          本文标题:去除点击事件300ms延迟 (使用了vue之后)

          本文链接:https://www.haomeiwen.com/subject/uuyklftx.html