我a href
指向#
<a href="#" id="bla" >Bla<a>
我有onclick功能,点击该href即显示弹出窗口。
function doingClick()
{
//display popup
return false;
}
但是,每次在浏览器中添加到网址时点击符号#
。
例如,在点击我的链接http://mywebsite.com
但点击a href
后,网址看起来像这样:http://mywebsite.com#
有没有办法避免这种行为?
答案 0 :(得分:10)
为避免这种情况,请尝试添加return false;
<a href="#" onclick="doingClick(); return false;">Link</a>
你也可以使用void(0)
<a href="javascript:void(0)" onclick="doingClick();">Link</a>
Which "href" value should I use for JavaScript links, "#" or "javascript:void(0)"?
有一个与此有关的小问题(小宗教战争!)答案 1 :(得分:4)
<a href="#" id="bla" onclick="return doingClick()">Link</a>
不要忘记返回功能的返回。否则,您只需在不暂停后续事件的情况下调用它。
答案 2 :(得分:2)
虽然还有其他有效的解决方案,但我个人更喜欢这种较短的解决方案。
<a href="javascript:;">Link</a>
另一个好处是此解决方案不会滚动到窗口的顶部。
答案 3 :(得分:1)
您可以添加style =“cursor:pointer;”而不是添加href。 这与显示超链接的效果相同,没有页内锚点效果。
<a id="bla" onclick="return doingClick()" style="cursor:pointer;">Link</a>
答案 4 :(得分:1)
所以我认为更好的方法是从href
元素中删除a
<a id="bla" class="href" >Bla</a>
而不是让它看起来像a href
只需添加简单的css类
.href
{
color: #2289b8; //color of the link
cursor: pointer;
}
当我查看SO
add comment
按钮
答案 5 :(得分:0)
#
用于链接元素ID,并且在“空”hrefs中使用时将始终添加到您的URL中。如果它真的让您烦恼,那么您可以做的是将其从location.href
函数中的doingClick
中删除
答案 6 :(得分:0)
一个简单的解决方法是将href设置为空:
<a href="" id="bla" onClick="alert('Hi');">Bla<a>
哪个仍有效。
答案 7 :(得分:0)
网址没有指向任何地方。该网址是#
的相对网址,换句话说,网址解析为<current_url>#
,在这种情况下为http://mywebsite.com#
。
要避免此行为,您必须更改URL。
如果你有一个返回false的onclick-handler,那么这应该会阻止链接处于活动状态:
<a href="#" onclick="return doingClick();">link</a>
您也可以使用javascript:void(0)作为链接href。
在任何一种情况下,请注意当您使用javascript访问网站的某些部分时,您网站的可访问性会降低。那些禁用了javascript,没有启用javascript浏览器或使用屏幕阅读器或其他可访问工具的用户可能无法使用该网站。
答案 8 :(得分:0)
如果你没有得到更好的答案,你可以通过下面的javascript在页面上(在正文或头部的开头)放置脚本标记来制作令人讨厌的丑陋的解决方法:
if(document.location.href[document.location.href.length-1]=='#'){
document.location.href = document.location.href.substring(0, document.location.href.length-2)
}
我不建议你这样做,因为当#在url中时会导致对服务器的双重请求,但是如果你必须的话,它会在这里。