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

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是事件

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