# HREF 中的（散列）字符阻止 preventDefault 工作答案

【问题标题】：# (hash) characters in a HREF stops preventDefault from working# HREF 中的（散列）字符阻止 preventDefault 工作
【发布时间】：2013-01-10 12:29:48
【问题描述】：

我之前发布了一个问题，即在链接中指定 HREF 时我的 jQuery 无法正常工作 (original question here)。

最常见的建议答案是使用 preventDefault，但由于某种原因，如果 HREF 中有哈希/锚点，这将不起作用；例如，如果 URL 是“http://www.google.com”，它会阻止默认行为并按预期运行 jQuery，但如果它是“http://www.google.co.uk#whatever”，它会忽略 preventDefault 并跟随链接。

我使用的链接有一个目标（实际上，只是同一页面中的一个目标）。这种古怪的行为是否有解决方法？

HTML

<li><a id="OfficeNav-Bath" class="first" href="#bath" >Bath</a></li>

jQuery

<script> <!--Offices jquery -->
        $(function() {$("#OfficeNav-Bath").click(function(e){e.preventDefault(); $('.office').removeClass('visible');});});
</script>

【问题讨论】：

在 href 中使用 jsFiddle # 没有影响，event.PreventDefault() 按预期工作。见DEMO
你有没有试过把'return false;'在您的点击事件功能结束时？
@algorhythm，是的，恐怕会受到同样的影响。
@OliJeffery: return false 等于 preventDefault 和 stopPropagation，因此如果问题在于阻止默认操作，那么 return false 没有任何区别是有道理的。 PreventDefault 似乎在最新的 FF、Chrome 和 IE9 中按预期工作。您是否在特定浏览器中运行特定版本的 jQuery？你能创建一个jsfiddle 来演示这个问题吗？

标签： jquery href preventdefault

【解决方案1】：

没有任何关于您正在使用的 jquery 的确切版本的任何信息，在 href 中使用 # 似乎使用 jQuery 1.8.2 没有问题。

在 href 中使用 jsFiddle # 没有影响，event.PreventDefault() 正在按预期工作。

DEMO - event.PreventDefault() 和 # 在href

上面的 DEMO 代码在链接腐烂的情况下如下。

HTML：

<a id="OfficeNav-Bath" class="first" href="http://www.google.com#whatever" >click me</a>

脚本：

$("#OfficeNav-Bath").on("click", function(event){
  event.preventDefault();
  alert("Prevent Default Works");
})

【讨论】：

@algorhythm：您链接的小提琴在 Chrome、FF 和 IE 9 中也可以正常工作。您在哪个浏览器中测试它不工作的地方？
错误出现在我试图运行的代码中；使用您的 jFiddle 示例，我使版本正常工作。似乎一开始就包含 $(function() { 把事情搞砸了。
@FrançoisWahl 为什么要问我？我对上面的代码没有任何疑问
@algorhythm：啊，我明白了。我以为您打算将小提琴链接为代码不工作的示例，这就是为什么我问您为什么认为它不工作。我为混淆道歉。我误解了评论。

【解决方案2】：

我认为您尝试执行的操作看起来不错，但是您的 javascript 标记块中有一个 HTML 注释，这可能会破坏您的脚本。删除。请记住，您的 javascript 日志/控制台是您的朋友。

【讨论】：

我试过删除它没有效果，恐怕......不过是个好主意。
@AdamCoulombe：你试过了吗？这条线似乎没有什么区别：jsfiddle.net/G4afEPreventDefault 似乎按预期工作。

【解决方案3】：

我认为这段代码没有问题，问题应该出在其他地方。

检查一下：

与目标：

【讨论】：