Question

我使用的是jQuery mobile，而且在手机上它运行良好，但我不希望它在桌面上运行。我怎么能防止这种情况？如果用户试图突出显示文本，桌面用户也会感到非常困惑。

Answer 1

您可以随时检查您是否在桌面设备上？

if(!(/Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent))) {
   $(document).ready(function(){
      $(document).on('swipeleft swiperight', 'html', function(event) {
             console.log("IN HERE");
             event.stopPropagation();
             event.preventDefault();
        }); 
   });
}

$(document).on('swipeleft swiperight', function () {
    $.mobile.changePage('#bar');
});

JSFIDDLE EXAMPLE

回答Marcelo Agimovel：

var timeoutId = 0;

$('ELEMENTHERE').on('mousedown', function() {
    timeoutId = setTimeout(myFunction, 1000);
}).on('mouseup mouseleave', function() {
    clearTimeout(timeoutId);
});

Answer 2

这是一个好问题。我无法理解反对票。我也在寻找解决方案，因为在桌面上选择文本（甚至在文本输入中）也会触发滑动事件。因此，目前的解决方案是：

var touchCapable = false;

$(document).one('touchstart', function(e){
    //we know that the device supports touch
    touchCapable = true;
});

$(document).on( "swipeleft swiperight", function( e ) {
    if(!touchCapable){
        e.stopPropagation();
        e.preventDefault();
    }else{
        ...
    }
});

该代码是我现在使用的简短版本。

更新或者我们可以像这样初始化touchCapable：

// https://stackoverflow.com/a/48810709/2947462
var touchCapable = (('ontouchstart' in window)
    || (navigator.maxTouchPoints > 0)
    || (navigator.msMaxTouchPoints > 0)
    || (window.TouchEvent));

桌面上的jQuery滑动禁用

2 个答案: