來源:http://itssh.cn/post/903.html
在Android下直接使用touchmove事件會(huì)在很多瀏覽器中出現(xiàn)每次操作只觸發(fā)一次touchmove的情況壹堰。這是因?yàn)锳ndroid中對(duì)觸屏事件奇葩解析造成的,在touchmove觸發(fā)的瞬間就觸發(fā)了touchcancel恩伺,后續(xù)事件就不執(zhí)行了鲫构,所以要在touchmove或者touchstart事件觸發(fā)的時(shí)候禁止它的默認(rèn)行為锈锤。
英語文檔地址:http://wilsonpage.co.uk/touch-events-in-chrome-android/
案例(請(qǐng)?jiān)诎沧康桶姹臼殖衷O(shè)備中測(cè)試):
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<meta name="apple-mobile-web-app-capable" content="yes" />
<meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=0" />
<title>touchmove執(zhí)行一次問題</title>
<!--
@author:SM
@email:sm0210@qq.com
-->
</head>
<body>
<div id="tdivInfo" style="border:1px solid red;min-height: 50px;">
這是div
</div>
<!--在touchstart中添加e.preventDefault();-->
<script type="text/javascript">
var td = document.getElementById('tdivInfo');
td.addEventListener("touchstart", function(e){e.preventDefault();td.innerHTML+='start....<br/>';}, false)
td.addEventListener("touchmove", function(e){td.innerHTML+='move....<br/>';}, false)
td.addEventListener("touchend", function(e){td.innerHTML+='end....<br/>';}, false)
</script>
</body>
</html>