Как предотвратить «прокрутку» при запуске события «touchstart»

Question

У меня есть прокручиваемый элемент, к которому я добавил два обработчика событий («touchstart» и «scroll»). Оба работают отлично, если их стреляют сами. Однако, когда событие «touchstart» запускается, мне нужно предотвратить «прокрутку» от увольнения, но мне все еще нужно, чтобы событие «прокрутки» было доступно. Причина в том, что оба события вызывают одну и ту же функцию, и поэтому приложение вызывает искажение, когда логика выполняется много раз.

Я создал основную скрипку и вот ссылка:

http://jsfiddle.net/alejandro1585/0t7v76m7/3/

HTML:

<div class="main-container"> 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
    Hello world 
</div> 

CSS:

.main-container{ 
    border: 1px solid red; 
    width: 120px; 
    height:200px; 
    overflow-y: auto; 
} 

JAVASCRIPT:

function myFunction(e) { 
    console.log("myFunction is being executed", e); 
}; 

/*Method adds handlers to the scrollable list so that functions to show or hide the header can be triggered*/ 
var scrollShowHideHeaderInit = function() { 
    var divObject = document.getElementsByClassName("main-container"); //Scrollable element object 

    for (var i = 0; i < divObject.length; i++) { 
     divObject[i].addEventListener("scroll", myFunction); 
     divObject[i].addEventListener("touchstart", myFunction); 
    }; 
}; 

scrollShowHideHeaderInit(); 

Answer 1

Вы должны быть в состоянии просто остановить распространение события на ощупь начать и по-прежнему поддерживать прокрутки способность

function touch(e){ 
    console.log("touch", e); 
    e.stopPropagation(); 
};