下拉菜单显示触摸事件

Dropdown menu dissapearing on touch event

本文关键字：事件 触摸 显示 下拉菜单      更新时间：2023-09-26

我正在开发一个遗留网站，该网站有很多问题，但其中一个问题确实令人恼火和困惑。它有一个下拉菜单，可以简单地使用jquery条件进行切换。

问题是，当我在iPhone/Android上打开它，并试图向下滚动查看其余菜单项时，菜单会消失。

这是加载它的脚本：

/* MOBILE COLLAPSE MENU */
;(function ($) {
  $.fn.collapsable = function (options) {
  // iterate and reformat each matched element
  return this.each(function () {
  // cache this:
  var obj = $(this)
  var tree = obj.next('.mobile_navigation')
  obj.click(function () {
    if (obj.is(':visible')) {tree.toggle();}
  })
  $(window).resize(function () {
    if ($(window).width() <= 480) {tree.attr('style', '');}
  })
 })
 }
 })(jQuery)

我该怎么解决这个问题？我认为这与$（window）.resize函数有关，因为它正在加载一个较小的视口，但我不知道该怎么办。

请仔细检查您正在导入jquery库导入两次。。

或

试试这个

<!DOCTYPE html>
<html>
<head>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.4/jquery.min.js"></script>
<script>
   $(document).ready(function(){
      $("button").click(function(){
         $("p").slideToggle();
     });
   });
 </script>
</head>
<body>
<div>
<button>Toggle slideUp() and slideDown()</button>
</div>
<p><a href="#">Link 1</a></p>
<p><a href="#">Link 1</a></p>
<p><a href="#">Link 1</a></p>
<p><a href="#">Link 1</a></p>
</body>
</html>
相关文章：