Immer, wenn ich auf ein Ankerelement klicke, springt das Fenster in Mobile nach oben.

Question

Ich mache responsive Dropdown-Menü. Es funktioniert gut in Laptop, aber wenn ich auf einen Link in diesem Dropdown mit meinem Android-Handy klicke, springt das Fenster nach oben. Ich habe versucht, preventDefault in der JQuery zu verwenden, aber ich denke, dass das Dropdown von CSS-Hover-Aktion angetrieben wird, deshalb funktioniert PreventDefault-Methode nicht. Irgendeine Idee, was ich in meinem JQuery hinzufügen sollte, um dies zu verhindern, weil es sehr nervig ist. Hier ist der Link. JSFiddle

Ich verwende dieses Skript, um den Text umzuschalten.

$(document).ready(function(){ 

     $(".show-menu").click(function(){ 
      if ($(this).text() == "Show Menu") 
       { 
        $(this).text("Close"); } else 
        { 
         $(this).text("Show Menu"); 
        }; 
      }); 


     });  

Answer 1

Das funktioniert.

$(document).ready(function(){ 

    $(".show-menu").click(function(e){ 
     if ($(this).text() == "Show Menu") 
      { 
       $(this).text("Close"); } else 
       { 
        $(this).text("Show Menu"); 
       }; 
     }); 
    e.preventDefault(); 
    return false; 
    });  

Alternativ können Sie den folgenden Code verwenden und entfernen Sie Ihre Hover-Funktionen in der CSS-Datei.

$("#menu li").hover(function(){ 
    $(this).find("ul.hidden").fadeIn("fast"); 
}, function(){ 
    $(this).find("ul.hidden").fadeOut("fast"); 
}); 

Answer 2

Sie können return false; neben .preventDefault() am Ende click(){ } verwenden, um die Standardaktion zu verhindern.