l***@163.com
l***@163.com
  • 发布:2016-04-23 20:20
  • 更新:2016-12-01 17:21
  • 阅读:5196

Drag拖动获取不到坐标,报:Cannot read property 'x' of undefined

分类:MUI
mui

下面是我的测试代码,

我想实现drag的时候,能够让下方的div随着drag变动。

但是,获取不到drag的坐标。

<!DOCTYPE html>  
<html>  
<head>  
    <meta charset="utf-8">  
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />  
    <title></title>  
    <script src="js/mui.min.js"></script>  
    <link href="http://ask.dcloud.net.cn/css/mui.min.css" rel="stylesheet"/>  
    <script type="text/javascript" charset="utf-8">  
        mui.init({  
                  gestureConfig:{  
                   tap: true, //默认为true  
                   doubletap: true, //默认为false  
                   longtap: true, //默认为false  
                   swipe: true, //默认为true  
                   drag: true, //默认为true  
                   hold:false,//默认为false,不监听  
                   release:false//默认为false,不监听  
                  }  
                });  
    </script>  
    <style type="text/css">  
        .footer{  
            position: absolute;  
            height: 60px;  
            background: red;  
            bottom: 0;  
            /*border: 1px solid black;*/  
            width: 100%;  
        }  
        .my-container{  
            overflow: hidden;  
            height: 100%;  
        }  
        .test{  
            position: relative;  
            left: 0;  
            width: 50px;  
            height: 50px;  
            border: 1px solid dodgerblue;  
            display: inline-block;  
        }  
        .test1{  
            height: 60px;  
            width: 2000px;  
            border: 1px solid black;  
        }  
    </style>  
</head>  
<body>  
    <div class="mui-content">  
        <footer class="footer">  
            <div class="my-container">  
                <div class="test1">  
                    <div class="test">1</div>  
                    <div class="test">2</div>  
                    <div class="test">3</div>  
                    <div class="test">4</div>  
                    <div class="test">5</div>  
                    <div class="test">6</div>  
                    <div class="test">7</div>  
                    <div class="test">8</div>  
                    <div class="test">9</div>  
                    <div class="test">0</div>  
                    <div class="test">11</div>  
                    <div class="test">12</div>  
                    <div class="test">13</div>  
                    <div class="test">14</div>  
                    <div class="test">15</div>  
                    <div class="test">16</div>  
                    <div class="test">17</div>  
                    <div class="test">18</div>  
                    <div class="test">19</div>  
                    <div class="test">20</div>  
                    <div class="test">21</div>  
                    <div class="test">22</div>  
                    <div class="test">23</div>  
                    <div class="test">24</div>  
                    <div class="test">25</div>    
                </div>  
            </div>  
        </footer>  
    </div>  
    <script type="text/javascript">  
        mui('.mui-content').on('drag','.test',function(e){  
            console.log(e.detail.move.x ":" e.detail.move.y);  
        });  
    </script>  
</body>  
</html>
2016-04-23 20:20 负责人:无 分享
已邀请:

最佳回复

Trust

Trust - 少说废话

  • Peach

    这个也够用了,可以获取移动距离

    2016-08-10 02:03

l***@163.com

l***@163.com (作者)

[Web浏览器] "Uncaught TypeError: Cannot read property 'x' of undefined" /test/index.html (86)

Peach

Peach

你解决了吗?我的也是提示没有定义

一朵羊毛飞上天

一朵羊毛飞上天

使用

e.detail.touches[0].clientX

就可以出来了. e是事件

该问题目前已经被锁定, 无法添加新回复