防止瀏覽器跳轉到錨點

如何防止瀏覽器跳轉到錨點鏈接？防止瀏覽器跳轉到錨點

我知道我可以用戶在onclick事件「返回false」，或者如果有人使用MooTools的做這樣的事情

$('button').addEvent('click', function(e) { 
e.stop() 
//do blabla 
});

這將跳轉到錨停止的瀏覽器，但我想將錨點保持在url中，以便共享鏈接。我正在使用錨來實際顯示動態信息。

任何想法？

來源

2011-04-19 Daniel Dimitrov

我通常處理這個問題的方法是URL哈希不匹配任何名稱或網頁上的ID屬性後使用的值。例如，「＃myValue = foo」而不是「#foo」。如果散列值與頁面上的元素匹配，我通常希望窗口滾動到該點。 – 2011-04-19 18:15:57

嘿傑西，我最終也這樣做。我正在設置哈希像＃！東西然後我只是刪除！當我想用這個散列在頁面上做某件事時。 – 2011-04-25 08:20:15

只需立即回滾到頁面頂部。

self.scrollTo(0, 0)

我有一個插件，做到了這一點，它發生得如此之快我只是認爲錨被打破。我不認爲有人會注意到。

來源

2011-04-19 18:09:37 mrtsherman

或者甚至更無縫的方式是在點擊處理程序中獲取當前窗口的滾動條位置，然後滾動到該位置而不是頂部。如果你將scrollTo（）調用放在setTimeout中，這應該可以工作。 – 2011-04-19 18:12:30

我還沒有機會測試這個跨瀏覽器，所以它可能會在IE中悲慘地失敗，但這裏是我用哈希鏈接更新URL，同時處理實際操作時發生的不同點擊（使用HTML5 history API）：

var setHash = function(hash) { 
    // Make sure that the hash is the first character, and extract from (presumably) full URL if not 
    if (hash.indexOf('#') > 0) { 
     hash = hash.substr(hash.lastIndexOf('#')); 
    } else if (hash.substr(0, 1) !== '#') { 
     hash = '#' + hash; 
    } 
    // Add our hash element to the history/URL 
    if (window.history.pushState) { 
     window.history.pushState(null, null, hash); 
    } else { 
     window.location = hash; 
    } 
}; 

$('button').addEvent('click', function(e) { 
    e.stop() 
    setHash(this.get('href')); 
    //do blabla 
});

來源

2011-04-19 18:34:51

IE無法正常工作！ – pascalvgemert 2013-05-16 11:49:39

防止瀏覽器跳轉到錨點

回答

相關問題