使用JavaScript 防止連結點擊時頁面捲動
使用JavaScript 或jQuery 增強連結行為時,通常會遇到點擊時出現的問題連結觸發頁面捲動到頂部。如果您希望阻止這種行為,您有幾個選擇。
首先,考慮 event.preventDefault() 方法。透過在傳遞給處理程序的事件物件上呼叫此方法,您可以有效地停用預設操作(例如導航至連結目標)。無論您在 DOM 中使用 jQuery 的 $e.preventDefault() 還是本機 Event.preventDefault(),這都有效。
例如,以下 jQuery 程式碼可防止捲動:
$('#ma_link').click(function($e) { $e.preventDefault(); doSomething(); });
另一個選項是利用 jQuery 的 return false;行為。透過從事件處理程序傳回 false,將自動呼叫 event.stopPropagation() 和 event.preventDefault()。因此,您可以使用以下方法:
$('#ma_link').click(function(e) { doSomething(); return false; });
此外,如果您喜歡原始 DOM 事件,在現代瀏覽器上傳回 false 將阻止預設連結行為。但是,建議明確呼叫 .preventDefault() 以獲得與舊版瀏覽器的最大相容性,因為 HTML5 規範最初並未包含此行為。
以上是如何使用 JavaScript 防止連結點擊時頁面滾動?的詳細內容。更多資訊請關注PHP中文網其他相關文章!