首页 > 在ios8的webview中,当手指滑动元素到webview边界外以后松开,不能触发touchend事件,什么原因?怎么解决?

在ios8的webview中,当手指滑动元素到webview边界外以后松开,不能触发touchend事件,什么原因?怎么解决?

在ios8的webview中,当手指滑动元素到webview边界外以后松开,不能触发touchend事件,但可以监听到touchmove事件, ios8以下的版本也没有问题

    <div class="outer">
        <div class="inner">
            在ios8 的webview中,当手指滑动到webview边界外松开后,js不能监听到touched事件。
        </div>
    </div>
    <script>
        var inner = document.querySelector('.inner');
        var v_start = 0, curY = 0;

        inner.addEventListener('touchstart', function(e){
            v_start = e.touches[0].pageY;
            curY = parseInt(inner.style.top.slice(0, -2)) || 0;
        }, false);

        inner.addEventListener('touchmove', function(e){
            var v_end = e.touches[0].pageY;
            inner.style.top = (curY + v_end - v_start) + 'px';
            console.log(inner.style.top);
        }, false);

        inner.addEventListener('touchend', function(e){
            inner.style.top = '0px';
            inner.innerHTML += 'touchend
'; }, false); inner.addEventListener('touchcancel', function (e) { e.preventDefault(); inner.innerHTML += 'touchcancel
'; }, false); document.addEventListener('touchmove', function(e){ e.preventDefault(); }, false); </script>

可以用 ios8 的 qq 访问一下这个地址 http://nanblog.net/test/touchend_ios8.html 将背景拉到最下面后,松开就没有触发touchend事件 (我用iPhone plus测试就是这样)


谢邀。

1、看看这个问题的最后一个回答是否对你有帮助:Understanding touch events

2、Javascript touchend (scroll) event dont work in UIWebView in ios 4

3、用hammer.js试试:hammer.js


没别的办法,只有在touchmove时侦测位置,然后强制执行touchend
if (e.changedTouches[0].pageY <= 0) {

            e.preventDefault();
            that._unbind("touchmove", window);
            that.dispatchEvent(new Event("touchEnd"));
            return;
        }

我在这个问题也纠结了一年多了,一直没有找到合适答案,要是哪位大神有办法解决这个问题,麻烦告诉我一下,可以发我邮箱295194117@qq.com,灰常感谢!!!


如果在 touchend 之前用戶取消了觸控(比如切換 app),touchcancel 會被觸發,而 touchend 則不會被觸發。

【热门文章】
【热门文章】