jquery - # HREF 中的（散列）字符阻止 preventDefault 工作

Question

我之前发布了一个问题，当在链接中指定 HREF 时，我的 jQuery 无法正常工作（此处为原始问题）。

最常见的建议答案是使用 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>

score 1 · Accepted Answer

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

看看这个：

有目标：

score 1 · Accepted Answer

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

score 1 · Accepted Answer

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

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

演示-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");
})

jquery - # HREF 中的（散列）字符阻止 preventDefault 工作

3 回答 3

Related

Reference