vue部分安卓手机无法触发touchend

突然发现一个特殊情况,某些安卓手机无法触发touchend事件,查资料后给出如下解决方案
第一种方案:
在监听touchstart或者touchmove事件的函数里,阻止事件的默认行为event.preventDefault(),那么到touchend就能正常触发

touchend(event) { //松开按键 event.preventDefault(); }

第二种方案:
同时绑定touchcancel和touchend事件,这样在安卓上就能通过触发touchcancel来重新展示我们的按钮。

touchend(event) { //松开按键 }

第三种方案:
阻止任何父事件的 event.stopPropagation()行为,那么到touchend就能正常触发。

touchend(event) { //松开按键 //阻止任何父事件处理程序被执行 event.stopPropagation(); }

第四种方案:
问题:
如果触发了 touchmove, touchend 就不会被触发了, 而且 touchmove 没有持续触发。
解决方法:
只要在 touchstart 的时候调用下 event.preventDefault(); 即可让其他事件都正常被触发了。

$(document).on("touchstart",".btn-highlight",function(){
        $(this).addClass("hover");
    }).on("touchmove",".btn-highlight",function(event){
        event.preventDefault();
    }).on("touchcancel touchend",".btn-highlight",function(event){
        $(this).removeClass("hover");
    });

你可能感兴趣的:(vue部分安卓手机无法触发touchend)