如何将onclick（）和href附加到<a> element, but only have one work at once</a>

Question

我有一个像这样的元素：

<a class='link' href='/page1'>Page 1</a>

它有一个附加的点击处理程序，如下所示：

$('.link').click(function() { loadPage('page1'); });

单击链接时，将加载新页面。但是，有两种方法可以加载新页面。一个是通过AJAX，它可以确定哪些元素在页面之间发生了变化，并且在没有刷新的情况下重新加载部分，以及通过正常的GET请求加载的部分。

我想将链接的href设置为正常加载的URL，而onlick（）则调用执行AJAX加载的javascript函数。但是，当我点击链接时它们都会触发，导致页面完全刷新。

有没有办法阻止“href”在Javascript可用时生效？

Answer 1

$('.link').click(function() { loadPage('page1'); return false });

或者

$('.link').click(function(e) { e.preventDefault(); loadPage('page1'); });

首先也是停止冒泡。第二，只阻止......默认动作（*转到某个链接）

Answer 2

从您的onclick处理程序返回false。

Answer 3

你可以这样做

<a class='link' href='/page1'>Page 1</a>

$('.link').click(function(e) { 
e.preventDefault(); // Prevents the default action, i.e. following the href
loadPage('page1'); 
});

Answer 4

问题的简短描述（return false;和e.preventDefault();之间的差异）是here。另外e.stopPropagation();可能需要考虑，特别是由于loadPage（）抛出错误的情况（如Ben Rowe所述）。