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

Question

在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测试就是这样）

Answer 1

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

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

Answer 2

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

Answer 3

谢邀。

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

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

3、用hammer.js试试：hammer.js

Answer 4

我在这个问题也纠结了一年多了，一直没有找到合适答案，要是哪位大神有办法解决这个问题，麻烦告诉我一下，可以发我邮箱[e-mail]，灰常感谢！！！