首頁  >  文章  >  web前端  >  以下是您提供的文章的一些基於問題的標題,重點關注單擊 JavaScript 連結後頁面滾動到頂部的問題: 簡短和直接: * 如何停止頁面捲動到

以下是您提供的文章的一些基於問題的標題,重點關注單擊 JavaScript 連結後頁面滾動到頂部的問題: 簡短和直接: * 如何停止頁面捲動到

Mary-Kate Olsen
Mary-Kate Olsen原創
2024-10-26 11:32:29609瀏覽

Here are some question-based titles for your provided article, focusing on the problem of page scrolling to the top after a JavaScript link click:

Short & Direct:

* How to Stop Page Scrolling to Top on JavaScript Link Click?
* Why Does My Page Jump to T

如何防止頁面在JavaScript 連結點擊上捲動到頂部:

從連結元素(例如錨點)觸發JavaScript 事件時標籤,事件觸發後頁面跳到頂部的問題是很常見的。

解決方案:

為了防止這種不良行為,有必要抑制點擊事件的預設動作。這可以使用兩種方法來實現:

1。 event.preventDefault():

透過在傳遞給事件處理程序的事件物件上呼叫 .preventDefault() 方法,您可以阻止導航到連結目標的預設行為。

範例(jQuery):

<code class="javascript">$('#my-link').click(function(event) {
  event.preventDefault();
  // Your JavaScript code here
});</code>

範例(DOM):

<code class="javascript">document.getElementById('my-link').addEventListener('click', function(event) {
  event.preventDefault();
  // Your JavaScript code here
});</code>

. return false:

在jQuery 中,從事件處理程序傳回false 將自動呼叫.stopPropagation() 和.preventDefault() 方法。

範例(jQuery):

<code class="javascript">$('#my-link').click(function(event) {
  // Your JavaScript code here
  return false;
});</code>

如果使用原始DOM 事件,建議明確呼叫.preventDefault() 以獲得與舊版瀏覽器的最大相容性。有關詳細信息,請參閱有關 event.preventDefault() 與 return false 的文檔。

以上是以下是您提供的文章的一些基於問題的標題,重點關注單擊 JavaScript 連結後頁面滾動到頂部的問題: 簡短和直接: * 如何停止頁面捲動到的詳細內容。更多資訊請關注PHP中文網其他相關文章!

陳述:
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn