防止改变网址哈希的href =“＃”链接

Question

我有一个网站已经利用了URL中的哈希值，我不希望它改变。当我使用Zurb基金会并使用href="#"作为菜单项时，单击它可删除以前的散列值。

如何覆盖此行为？

更新：我认为最好留在元素中，因为当我改变它时，它会改变绑定到该HTML元素的样式。我总是更喜欢使用设计框架来保持默认约定，而不是重写CSS属性。

谢谢。

Answer 1

请Progressive Enhancement和Unobtrusive JavaScript阅读起来。 （几乎）不会有href="#"。这是一个链接到一个未定义的锚点（这将是页面的顶部）。使用它的人通常会这样做，因为他们想把JavaScript关闭。

如果你要有一个链接，那么它应该指向某个有用的地方。通常，这将是另一个使用服务器端技术的页面，以获得与JavaScript相同的效果（虽然速度较慢）。然后您可以阻止链接的正常行为。

例如：

<a href="/foo/bar" class="whatever">Foo: Bar</a> 

随着脚本：

addEventListener('click', function (ev) { 
    if (ev.target.classList.contains('whatever')) { 
     ev.preventDefault(); 
     loadWithAjax(ev.target.href); 
    } 
}); 

如果JavaScript的做一些事情，不能有一个链接表示等效的功能，那么你不应该使用链接在第一位。使用<button>，并认真考虑使用JavaScript/DOM而不是HTML将其添加到文档。

（注：相当多的人要支持不承认classList或addEventListenerchecking browser support，并找到兼容性程序就留给读者做练习使用YUI，jQuery的或类似的是处理一个方法旧版浏览器。与兼容性）

Answer 2

而不是在href中有#，你可以在href中使用javascript:;，它不会让url更改。

<a href="javascript:;">:Link</a> 

Answer 3

您可以收听点击事件，并致电preventDefault停止浏览器设置哈希。

示例使用jQuery：

$('.mylink').click(function(event){ 
    event.preventDefault(); 
}); 

Answer 4

而不是使用 “＃” 的使用。 “的javascript：无效（0）” 请参阅此链接了解更多信息Which "href" value should I use for JavaScript links, "#" or "javascript:void(0)"?

Answer 5

只需使用这样的：

<a href="javascript:void()">text</a> 

Answer 6

最简单的方法是<a href="#hash" onclick="event.preventDefault();"></a>

Answer 7

在默认库中有以下代码。
这将采用单击事件的href值，如果发现哈希（＃）值，那么它将防止将避免重定向到href值的默认事件。

$(document).on('click', 'a', function (e) { 
    if ($('#'+e.target.id).attr('href')=='#') { 
     e.preventDefault(); 
    } 
}); 

Answer 8

我已经做了以下操作以防止所有的标签与HREF = “＃” 属性进行导航（使用jQuery）：

$('a[href$="#"]').click(function (event) { 
      event.preventDefault ? event.preventDefault() : event.returnValue = false; 

     }); 

Answer 9

我的解决办法是有点相同，使用使用Javascript：

- >通过更换

​​

：

<a href="javascript://" class="ouvrir">Newsletter</a> 

和JavaScript：

<script> 
    $('.ouvrir').click(function(event){ 
     window.location.href = "#foo"; 
     history.pushState('', document.title, window.location.pathname); 
    }); 
</script> 

Answer 10

我拿起它非常最近，但我试图从标签移除href属性完整，它工作得很好。 insted的的

<a href="#" onclick="something"></a> 
    use 
<a onclick="something"></a>