href =“＃”返回页首 - 预防？

Question

我有一个包含一些jQuery函数的页面。页面上的HTML如下所示：

<a href="#" class="service">Open</a>

单击“打开”按钮时，隐藏的面板会滑出。 jQuery本身效果很好但是当我点击按钮时它也会将我带到页面顶部。

这是defualt行为吗？如何阻止每个href="#"将我带到页面顶部。

注意：我可以添加id并告诉href指向该ID。我不想出于各种原因（包括添加不必要的代码）这样​​做。

Answer 1

<a href="#!" class="service">Open</a>

Answer 2

在您的事件处理程序中，添加e.preventDefault();（假设e是保存事件的变量的名称）：

$('.service').click(function(e) {
    e.preventDefault();
});

Answer 3

<a href="#" onclick="return false;" class="service">Open</a>

或

$(document).ready(function()
{ 
   var a = $(".service");
   a.click(function()
   {

       return false;

   });
});

或

$(document).ready(function()
{ 
   var a = $(".service");
   a.click(function(e)
   {

       e.preventDefault();

   });
});

或

<a href="#" onclick="event.preventDefault();" class="service">Open</a>

Answer 4

$('service').click(function() {
<your code>
return false;
});

return false会覆盖'a'标记的标准行为，并在点击时停止浏览器返回页面顶部。