Swipe、swipeleft、swiperight 事件不会在图像上触发

Posted 2023-03-05

【中文标题】Swipe、swipeleft、swiperight 事件不会在图像上触发

【英文标题】：Swipe, swipeleft, swiperight events do not trigger on image

【发布时间】：2013-03-14 16:34:46

【问题描述】：

我想将 jQuery mobile 的 swiperight event 与图像结合使用，但这似乎不起作用。

html：

<div id="one"><img src="http://jquerymobile.com/wp-content/uploads/2012/09/jquery-mobile-logo-03.png"/></div>
<div id="two">works</div>

JS：

$("#one").on("swiperight", function() 
    alert("does not work");
);
$("#two").on("swiperight", function() 
    alert("works");
);

JSFiddle

【参考方案1】：

我很确定只有桌面浏览器有这个问题，因为移动浏览器通常不会在滑动时拖动图像。

建议的解决方案here 防止在所有浏览器中拖动您的图像：

$('img').on('dragstart', function(event) 
    event.preventDefault();
);

这是你的新工作小提琴：http://jsfiddle.net/4CbEQ/1/

【参考方案2】：

您需要防止图像拖动，这是一个工作示例：http://jsfiddle.net/Gajotres/SgUZK/

$(document).on('pagebeforeshow', '#index', function()   
    $('img').on('dragstart', function(event)  event.preventDefault(); );

    $("#one").on("swiperight", function() 
        alert("does not work");
    );
    $("#two").on("swiperight", function() 
        alert("works");
    );
);