Question

网址为http://development-client-server.com/dreamscience/product-category/models/focus/focus-st/focus-st225-mk2/，问题在于显示“过滤产品”的蓝色按钮。如果你在手机上打开它，点击“模型”它会打开并关闭就好了。其他人也一样。但是，如果你打开“模型”，然后尝试打开另一个，说“类别”，切换不再有效。

我尝试过toggleClass（），toggle（），slideToggle（）和直接show（）和hide（）并搜索大量不同的变体。我也尝试将“点击”更改为“touchstart click”，只使用“touchstart”而不做任何更改。

它在普通计算机上工作正常，屏幕缩小到移动大小。它在运行最新版本的iPhone Safari上不起作用。

以下是该脚本的当前版本：

function mobileFiltering() {
  $(document).on("click", ".prdctfltr_regular_title", function() {
    var status = $(this).hasClass('active');
    if (status) {
      $(this).removeClass('active');
      $(this).next().hide();
    } else {
      $(this).addClass('active');
      $(this).next().show();
    }
  });
}

if ($(window).width() < 975) {
  mobileFiltering();
} else {
  $('.prdctfltr_regular_title').unbind();
}

$(window).resize(function() {
  if ($(window).width() < 975) {
    mobileFiltering();
  } else {
    $('.prdctfltr_regular_title').unbind();
  }
});

更奇怪的是，如果我删除show / hide toggle并且只具有removeClass / addClass功能，那么它可以正常工作。

感谢您对此提供任何帮助，因为这似乎是我在移动设备上进行的所有切换问题。

Answer 1

这似乎是由于您通过设置的事件委派设置多次触发事件造成的，我的建议是使用HWND停止所有其他事件。

像这样：

stopPropagation

希望这有帮助！

首次触发后，jQuery show / hide切换停止在手机上工作

1 个答案: