触发事件在触摸设备中不起作用

Question

我有下面的JS代码，它在桌面上可以正常运行，但在触摸设备上不能运行。

jQuery(document).ready(function(){
  jQuery("#gallery_trigger").click(function () {
    jQuery(".my-second-portfolio").trigger( "click");
  });  

});

通过分析，我发现以下代码行不起作用

jQuery(".my-second-portfolio").trigger( "click");

我了解.trigger（“ click”）; 不适用于触摸设备，所以请您帮我在所有设备上使用此代码？

Answer 1

尝试“点击”或“ vclick”

http://api.jquerymobile.com/tap/

$(".my-second-portfolio").tap();

Answer 2

在jQuery中学习的第一件事是调用$（document）.ready（）函数中的代码，以便一旦加载DOM，一切都将执行。 但是，在jQuery Mobile中，Ajax用于在导航时将每个页面的内容加载到DOM中。 因此，$（document）.ready（）将在加载第一页之前触发，并且用于页面操作的每个代码都将在刷新页面后执行。 这可能是一个非常微妙的错误。 在某些系统上，它似乎工作正常，但在其他系统上，则可能导致不稳定，难以重复的怪异现象发生。

经典jQuery语法：

$(document).ready(function() { 

});

为了解决此问题（并相信我这是一个问题），jQuery Mobile开发人员创建了页面事件。 简而言之，页面事件是在页面执行的特定点触发的事件。 这些页面事件之一是pageinit事件，我们可以像这样使用它：

$(document).on('pageinit', function() {

});

要执行仅对索引页可用的代码，我们可以使用以下语法：

$('#index').on('pageinit', function() {

});

还有另一个特殊的jQuery Mobile事件称为mobileinit。当jQuery Mobile启动时，它将触发文档对象上的mobileinit事件。 要覆盖默认设置，请将它们绑定到mobileinit。 使用mobileinit的一个很好的例子是关闭ajax页面加载，或更改默认的ajax加载器行为。

$(document).on("mobileinit", function(){
  //apply overrides here
});

或者，您可以使用如下所示的内容：

$('div:jqmData(url="index.html")').on('pageshow',function(){
    // code to execute on that page
    //$(this) works as expected - refers the page
});

Answer 3

您可以尝试使用$('.my-second-portfolio')[0].click(); 模拟鼠标单击实际DOM元素（而不是jQuery对象），而不是使用.trigger（）jQuery方法。

注意：DOM Level 2 .click（）在Safari中的某些元素上不起作用。 您将需要使用解决方法。

http://api.jquery.com/click/