Javascript 不适用于移动设备，但适用于桌面设备

Question

这适用于桌面浏览器，但不适用于我的 iOS 手机。 我尝试添加“touchstart”并查看这篇文章的解决方案以检查其他人是如何让它工作的，但它仍然无法正常工作。 关于其他选择的任何建议？ 我还尝试添加e.preventDefault() - 并将 e 添加到 function()，但这并没有奏效。

我试过：

 $('body').on('click touchstart', '.myContainer', function() {
     $(this).toggleClass('myContainer-unselected').toggleClass('myContainer-selected');
 });

编辑：看来可能还有其他事情发生，我将代码更改为尽可能通用，并且它没有在 iOS 上触发事件，而是在我的 chrome 模拟器中工作：

$(document).on('click touchstart', 'body', function() {
      alert('hi');
    });

补充更新：

我已将以下代码添加到我的 script.js 文件中：

$('body').css('display', 'none');

正如预期的那样，我的桌面浏览器在本地和 heroku 上的屏幕都变黑了，但是当我在移动设备上测试时，屏幕不是空的。 看起来 js 工作不正常。

附上图片：

Answer 1

回答：它在 iOS Safari 上不起作用的原因是因为在我的 js 页面中我使用的是 ES6，特别是“let”，[目前不支持][1]。 改成 ES5，问题就消失了。

$('body').on('click', '.dashboard_leftNav_category a', function() {
      var link = $(this).attr('showSection'); //changed from let link
      var show = $('[section="'+link+'"]');
      $('[section]').hide();
      $('body').find(show).fadeIn();
      $('html,body').scrollTop(0);
    });

Answer 2

这应该对你有帮助。 不是将它绑定到 body 元素，而是将事件绑定到文档。

$(document).on('click touchstart', '.myContainer', function() {

      $(this).toggleClass('myContainer-unselected').toggleClass('myContainer-selected');
    });

还尝试更改将以下样式添加到 myContainer 类

cursor : pointer;

Answer 3

您有两个选择：

1. 重置您的移动浏览器的历史记录，因为您的浏览器缓存读取旧源。
2. 更改桌面中源文件的名称并再次刷新页面。

Answer 4

把e.preventDefault(); 在您的 javascript 函数中。