點擊JavaScript 觸發的連結時防止頁面捲動到頂部
點擊與JavaScript 事件關聯的連結時,例如:
<a href="#">My Link</a>
頁面可能會意外滾動到頂部。若要在保持連結功能的同時防止此行為,請考慮以下解決方案:
選項1:event.preventDefault()
利用事件物件的.preventDefault( ) 方法防止瀏覽器執行導覽至連結的預設操作。
<code class="javascript">$('#ma_link').click(function($e) { $e.preventDefault(); doSomething(); }); document.getElementById('#ma_link').addEventListener('click', function (e) { e.preventDefault(); doSomething(); })</code>
選項 2:傳回 false;
在 jQuery 中,從事件傳回 false handler 自動呼叫 event.stopPropagation() 和 event.preventDefault()。
<code class="javascript">$('#ma_link').click(function(e) { doSomething(); return false; });</code>
為了獲得更多瀏覽器相容性,請在使用原始 DOM 事件時明確呼叫 .preventDefault()。
以上是如何防止點擊 JavaScript 連結時頁面滾動到頂部?的詳細內容。更多資訊請關注PHP中文網其他相關文章!