2011-04-13 74 views
4

我有一個lightbox疊加層,我使用下面的命令取消瀏覽器窗口滾動頁面的「#」的href錨點。我有它的工作,所以它不會在初始點擊時滾動窗口,但是在關閉lightbox疊加層時,瀏覽器會滾動到頂部,並且#會附加到URL。返回false onclick錨點不完全正常工作

<a href="#" onclick="somefunction(); return false;">... 

甚至這個...

<a href="javascript:void(0)" onclick="somefunction(); return false;">... 

的聯繫是其中的onclick功能觸發覆蓋彈出一個可點擊的圖像上。

Andy的想法如何防止瀏覽器在退出疊加層時滾動到頂部?

回答

9

我建議不要使用錨標籤。如果你不想要一個HREF值,那麼它實際上不是一個到另一個頁面的鏈接,所以可能不是真正的鏈接。如果該網站必須可以訪問sans javascript,那麼您需要更多地思考這個問題,並提出一個解決方案,該解決方案將允許一個真正的href值與實際內容鏈接。

但是,如果你確定這個是一個JS-所需的應用程序,那麼你可以這樣做:

<a href="javascript:;" onclick="somefunction(); return false;"> 

但是,再說一次,這真是你點擊到,而更新UI比去某個地方,所以我只是讓它成爲一個DIV,給它一個onclick事件,並完成它。但一定要給div一個tabindex,以便它可以通過鍵盤訪問。

+0

onclick =「blah(); return false;」如果blah()中存在錯誤,則不會停止默認定位標記。添加href =「javascript :;」訣竅。保存我的屁股。謝謝DA。 – mrbinky3000 2012-02-07 15:28:42

+0

'不使用錨標籤' - 我不同意。那些不支持JavaScript的瀏覽器(如Opera mini)呢? 「Javascripted」錨是一個很好的跨瀏覽器解決方案。如果瀏覽器不支持JavaScript,則可以通過錨定href來完成服務器端的任務。 – matewka 2013-07-15 17:27:49

+0

@matewka我解答了所有的答案。如果你需要支持非JS選項,那麼必須有一個實際的href鏈接到一個實際的頁面。 – 2013-07-15 17:41:13

6

您應該避開# href和javascript:僞協議。

鏈接應始終指向有效的資源。

如果您不能使用像button這樣的更合適的元素(如您的示例所示),我會使用event.preventDefault()取消默認行爲。

+2

+1好的建議。 – maerics 2011-04-13 05:25:08

+0

使用錨標籤來執行JavaScript是一個Web標準。它沒有什麼問題。即使谷歌同意。 – Amalgovinus 2014-09-27 00:23:36

+0

@Amalgovinus當'button'元素存在時,爲什麼要濫用'a'元素?關於*在新窗口中打開鏈接*,*複製鏈接位置*,*郵寄此鏈接*以及瀏覽器提供的所有其他內容,但是如果您決定由於某種原因使它們成爲'a'元素,它將無法使用。 – alex 2014-09-29 00:00:31