javascript 只允許一些滾動

Question

我正在構建一個基於 web 的小型媒體播放器，其基本結構如下

<div id="content">
    <!-- Some stuff -->
    <div id="playlist" style="overflow-y: scroll">
        <ul>
            <li> </li>
            <!-- ... -->
        </ul>
    </div>
    <!-- more stuff -->
</div>

我構建了播放器以完全適合 iphone window，並且我希望在有人在頁面上移動手指時禁用滾動。 但我想允許兩個手指在播放列表 div 內滾動。 我嘗試了正常的路線

document.ontouchmove = function(e){
    e.preventDefault();
}

但這會禁用兩個手指滾動。

想法？

Answer 1

    document.ontouchmove = function(e) {
        var target = e.currentTarget;
        while(target) {
            if((target.id === 'playlist'))
                return;
            target = target.parentNode;
        }

        e.preventDefault();
    };

Answer 2

如果事件來自播放列表之外，您只能preventDefault ：

document.ontouchmove = function (e) {
    if (e.target.id !== 'playlist') {
        e.preventDefault();
    }
};