如何防止锚点击跳转？

我使用e.preventDefault(); 禁用默认锚行为。

有没有办法阻止只在点击时跳转到目标？

我试过了：

  var hash = window.location.hash; var link = $('a'); $('a').click(function() { e.preventDefault(); hash = "#"+link.attr("href"); }); 

但它不起作用： http ： //jsfiddle.net/ynts/LgcmB/ 。

Answer 1

 $(document).ready(function() { var hash = window.location.hash; var link = $('a'); $('a').click(function(e) { e.preventDefault(); hash = link.attr("href"); window.location = hash; }); }); 

您还必须在函数中指定事件参数。 通过将其命名为e或event ，然后您可以操纵它。

Answer 2

这是我能提出的唯一解决方案，它可以在所有桌面和移动浏览器中使用各种客户端UI库和框架。 通过在滚动之前获取窗口坐标，我们可以恢复并保持当前滚动位置。

 $('a').click(function (e) { var x = window.pageXOffset, y = window.pageYOffset; $(window).one('scroll', function () { window.scrollTo(x, y); }) }); 

Answer 3

要仅阻止“跳转”，您必须使用与锚点中指定的目标元素不同的id。

例如，对于新标签使用的链接，

并且对于目标元素掩盖id

然后在您的脚本中将掩码附加到实际哈希，并使用它来获取元素。

 $(window).on("hashchange", function(){ var hash = this.location.hash; var mytab = $(hash + "-tab"); }); 

这样可以保留浏览器历史记录中的哈希位置更改，这些更改可以由后退/前进按钮控制，并且如果用户进入指定了哈希的页面， hashchange在页面加载时使用hashchange事件检测到。

Answer 4

您应该将onclick事件绑定到anchor并指定return false; 结果是。 return false; 语句导致默认点击行为（跳转）不起作用。 你可以在这里找到更多信息： 如何在加载页面时禁用锚点“跳转”？

Answer 5

您需要在函数上传递事件。

  var hash = window.location.hash; var link = $('a'); //pass event here $('a').click(function(e) { e.preventDefault(); hash = "#"+link.attr("href"); });