停止 Touchscroll 也会阻止点击链接

Question

我得到这段代码，当有人试图在移动菜单中触摸滚动时，它应该会禁止整个页面滚动。不幸的是，它也阻止了触摸点击链接（仅限触摸屏）。我需要确保链接仍然可以点击。

(function(){
function isTouchDevice(){
try{
document.createEvent("TouchEvent");
return true;
}catch(e){
return false;
}
}
function touchScroll(id){
if(isTouchDevice()){ //if touch events exist...
var el=document.getElementById(id);
var scrollStartPos=0;
document.getElementById(id).addEventListener("touchstart", function(event) {
scrollStartPos=this.scrollTop+event.touches[0].pageY;
event.preventDefault();
},false);
document.getElementById(id).addEventListener("touchmove", function(event) {
this.scrollTop=scrollStartPos-event.touches[0].pageY;
event.preventDefault();
},false);
}
}
//On page load
touchScroll('mainmenu-mobile')
})();

从这里获取代码：http://chris-barr.com/2010/05/scrolling_a_overflowauto_element_on_a_touch_screen_device/

http://jsfiddle.net/nv3vj29f/

Answer 1

在 touchstart 事件中，您应该删除 event.preventDefault() 行。这会阻止点击链接。

不用说，您应该将 event.preventDefault() 保持在触摸移动上，因为这会阻止滚动。

停止 Touchscroll 也会阻止点击链接

Stopping Touchscroll also prevents clicking links

html

javascript

touchscreen

vertical-scrolling

preventdefault