HTML / jQuery：如何正確調用錨標記上的函數（跨瀏覽器）

Question

我有一個頁面，其中包含一些用於調用函數的鏈接（錨標簽）。

一切都按預期進行，但是我不知道在這里如何避免這種跨瀏覽器出現問題的正確方法，因為我在Google上看到了不同的方法。

我使用jQuery而不是內聯javascript來調用函數，因為這樣，我所有的函數都以相同的方式調用+我想通過使用類從不同元素中調用相同的函數。

有人可以告訴我下面是否是避免跨瀏覽器問題的正確方法（IE8，IE9，FF，Chrome）？

另外，我是否必須在函數中添加以下內容之一或類似內容？

return false;

要么

e.preventDefault();

我的HTML：

<a href="javascript:void(0)" class="deco-min showSiteMap">Site Map</a>

我的jQuery：

$('.showSiteMap').on('click', function() {
    showSiteMap();
});

Answer 1

由於您使用的是jQuery，因此跨瀏覽器的作用域由庫本身處理，因此您不必擔心。 因此，這兩種方法都可以正常工作。

第一種方法將阻止默認操作並停止事件傳播。.僅使用您想要的方法。

對於第二種方法，您需要在點擊處理程序中接受event參數，例如

$('.showSiteMap').on('click', function(e) {
    showSiteMap();
    e.preventDefault();
});

在這兩種方法中，都不需要像這樣的href屬性，您可以使用

<a href="#" class="deco-min showSiteMap">Site Map</a>

Answer 2

對於不是真正鏈接的鏈接，您在href內容很大程度上取決於樣式。 我喜歡給他們一些散列片段，以提示他們要做什么（ href="#sitemap" ），因為用戶有時有時會在狀態區域中查看鏈接以了解其操作。*但是您可以使用href="#" ， href="javascript:void(0)" ， href="javascript:;" ， 隨你。

在鏈接的jQuery處理程序中，如果您使用哈希片段，則如果您不希望將哈希添加到URL（並且頁面可能滾動到），則可能需要阻止鏈接的默認操作（跟隨鏈接）具有匹配id的元素（如果有）。 您可以使用e.preventDefault()或使用return false; 。 return false; 做兩件事： e.preventDefault(); 和e.stopPropagation(); （防止事件從鏈接的冒泡到祖先元素）。 因此，請使用對您的應用程序有意義的任何一種。

所以：

$('.showSiteMap').on('click', function() {
    showSiteMap();
    return false;
});

...如果要防止默認設置並停止傳播。

要么：

$('.showSiteMap').on('click', function(e) {
    e.preventDefault();
    showSiteMap();
});

...如果您只是想防止默認設置（遵循鏈接），但又不想停止傳播。

如果您的href要么是中javascript:上面的例子，你不必阻止默認，因為默認是空操作。

---

*但是我通常使用哈希片段。 我不處理單擊鏈接的問題，而是處理URL上的哈希更改，並使頁面更改狀態與哈希匹配。 這使得可收藏的應用程序成為可能。 （我不使用鏈接進行操作，這就是按鈕的作用。）