下拉菜單在觸摸事件中消失

我在一個遺留網站上工作，這個網站有很多問題，但其中一個真的讓人煩惱和困惑。它有一個下拉菜單，它只是簡單地使用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函數有關，因爲它正在加載一個較小的視口，但我不知道該怎麼做。

來源

2016-08-03 snkv

當你在移動設備可以刪除然後onClick事件，並添加關閉按鈕。 –

您是否嘗試過評論調整大小的部分？我認爲這是你的問題來自哪裏，也許你不再需要它，如果你想在桌面和移動設備上有相同的行爲 – shwarp

注意調整大小的部分做到了。我試圖根據自己的口味修改它，但沒有嘗試對它進行評論......感謝，現在就做到了。 – snkv

請仔細檢查你正在導入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>

來源

2016-08-03 10:35:04 NoOneCare

下拉菜單在觸摸事件中消失

回答

相關問題