Javascript removeClass在iOS上不工作

单击

。菜单按钮

jquery将添加一个名为

active

的类。此Jquery代码适用于Windows和Android，但iOS除外（使用Chrome和Safari进行测试）

HTML5

<div class="menuButton">
  Menu Button
</div>
<div class="navmenu">
  <ul>
    <li><a href="#">Home</a></li>
    <li><a href="#">Something</a></li>
  </ul>
</div>

CSS3

.menuButton {
  display:block;
  cursor:pointer;
}
.navmenu {
  display:none;
}
.navmenu.active {
  display:block;
}

问题：当您单击

.menuButton

时，菜单将显示，但当您单击

html

时，菜单将不会运行

removeClass（'active'）

。此问题仅在iOS上发生

JsFiddle：

更新的JSFIDLE:

更新 显然，iOS在（'click'）上不使用

，

，但是添加以下代码将为我获得一个Hello World

$（'.menuButton'）。在（'touchstart click'，function（）{alert（'Hello World'）；}）。坏消息是，将我的代码从（'click'）

上的

更改为（'touchstart click'）

上的

不会对删除该类产生影响。
您能试试吗

看这里

你能试试这个吗

看这里

试试这个

$(document).ready(function() {
  var $ua = navigator.userAgent;
  var $event = ($ua.match(/(iPod|iPhone|iPad)/i)) ? "touchstart" : "click";

  $(document).on($event, function(ev) {
    if ($('.navmenu').hasClass('active')) {
      $('.navmenu').toggleClass('active');
    }
  });
  $('.menuButton').on('click', function(e) {
    e.stopPropagation();
    $('.navmenu').toggleClass('active');
  });
});


我真的认为你的问题是$（'html'）。在iOS上单击（），你可以搜索其他解决方案（如触摸操作）或检查这项工作是否有效。$（'html'）。单击（函数（）{alert（'hello world'）；}）

试试这个

$(document).ready(function() {
  var $ua = navigator.userAgent;
  var $event = ($ua.match(/(iPod|iPhone|iPad)/i)) ? "touchstart" : "click";

  $(document).on($event, function(ev) {
    if ($('.navmenu').hasClass('active')) {
      $('.navmenu').toggleClass('active');
    }
  });
  $('.menuButton').on('click', function(e) {
    e.stopPropagation();
    $('.navmenu').toggleClass('active');
  });
});


我真的认为你的问题是$（'html'）。在iOS上单击（），你可以搜索其他解决方案（如触摸操作）或检查这项工作是否有效。$（'html'）。单击（函数（）{alert（'hello world'）；}）

您应该将单击事件绑定到
文档
而不是
'html'
@A.Wolff如果我这样做，它将不会删除
活动的
类（不在Windows上的Chrome上）。这是怎么回事？无论如何，您在这里过于复杂了，我仍然不确定您预期的行为是什么？？？将.menuButton{cursor:pointer；}添加到您的css@Nikki9696
$.fn.removeClass（）
是在jQuery原型上定义的，不是窗口全局范围，但你是对的。无论如何，不这样做更安全。你应该将单击事件绑定到
文档
而不是
'html'
@A.Wolff。如果我这样做，它将不会删除
活动的
类（不在Windows上的Chrome上）。这是怎么回事？无论如何，您在这里过于复杂了，我仍然不确定您预期的行为是什么？？？将.menuButton{cursor:pointer；}添加到您的css@Nikki9696
$.fn.removeClass（）
是在jQuery原型上定义的，不是窗口全局范围，但您是对的，无论如何不这样做更安全我更改了
$（'html'）。on（'click'，函数（{}）；
到
$（文档）。on（'click'，function（）{}）；
但这没有什么区别。上面的代码在Windows和Android上工作，但在iOS上不再工作。您更改了html光标指针？并测试了userAgent？我想您的问题是关于文档单击功能，而不是您的代码。$（'html'）。on（'touchstart'，function（）{alert'）（'hello world'）；}）；我放了更多的代码，请测试。（对不起，我只有android）谢谢！只需要Jquery代码，现在它可以在每个设备上运行了！：）我更改了
$（'html'）。on（'click'，function（）{}）；
到
$（document）。on（'click'，function（）{}）；
但这并没有什么区别。上面的代码在Windows和Android上工作，但在iOS上不再工作。您更改了html光标指针？并测试了userAgent？我想您的问题在于文档单击功能，而不是代码。$（'html'）。在（'touchstart'，function（）{alert（'hello world'）；}）上；我添加了更多代码，请测试。（对不起，我只有android）谢谢！只需要Jquery代码，现在它可以在每台设备上运行了！：）
$(document).ready(function() {
  var $ua = navigator.userAgent;
  var $event = ($ua.match(/(iPod|iPhone|iPad)/i)) ? "touchstart" : "click";

  $(document).on($event, function(ev) {
    if ($('.navmenu').hasClass('active')) {
      $('.navmenu').toggleClass('active');
    }
  });
  $('.menuButton').on('click', function(e) {
    e.stopPropagation();
    $('.navmenu').toggleClass('active');
  });
});

var ua = navigator.userAgent,
        event = (ua.match(/iPad/i)) ? "touchstart" : "click";

$(document).on(event, function (ev) {
    ...
});