单击链接时意外的页面向上滚动 [英] Unexpected page scroll up when clicking a link

问题描述

我写了一个HTML页面，主要在iPad上浏览。基本上这是一个常见问题列表，每个问题都有一个悬停效果。为了启动ipad上的悬停效果，我不得不放置这样的虚拟链接。

 < a href =＃ >问题？< / a> 
  

以下是每个浏览器都有效的问题：列表太长时，您必须向下滚动，当您点击页面底部的链接时，它会在启动悬停效果时跳回顶部。我为演示目的做了一个小提琴：

http：/ /jsfiddle.net/SWXHR/1/

向下滚动并点击最后一个链接时，页面将跳转到顶部。

问题：如何防止页面在使用虚拟链接时跳转到顶部？

解决方案 div>

添加到您的链接：

 < a href =＃onClick =return false; >问题？< / a> 
  

或者如果您是通过JQuery来完成的话：

  $（'a [href =＃]'）。click（function（event）{
 
 event.preventDefault（）; 
 
}）; 
  

I wrote an HTML page which is being viewed primarily on the iPad. Basically it's an FAQ list with a hover effect on each question. To initiate the hover effect on the ipad I had to put a dummy link like this.

<a href="#">The question?</a>

Here is the problem which is valid for every browser: When the list is so long that you have to scroll down and when you click on a link at the bottom of the page, it jumps back to the top while initiating the hover effect. I made a fiddle for demonstrating purpose:

http://jsfiddle.net/SWXHR/1/

When scrolling down and clicking on the last link, the page will jump to the top.

Question: How can I prevent the page from jumping to the top when using a dummy link?

解决方案

Add this to your links:

<a href="#" onClick="return false;">The question?</a>

Or if you're doing it through JQuery:

$('a[href="#"]').click(function(event){

    event.preventDefault();

});

这篇关于单击链接时意外的页面向上滚动的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！