a標籤中防止跳轉的href="javascript:;"、"void(0);"等都是什麼意思

  • 2019 年 11 月 13 日
  • 筆記

標籤的 href 屬性用於指定超鏈接目標的 URL,href 屬性的值可以是任何有效文檔的相對或絕對 URL(路徑),包括片段標識符和 JavaScript 程式碼段。

javascript: 是表示在觸發默認動作時,執行一段JavaScript程式碼,而 javascript:; 表示什麼都不執行,這樣點擊時就沒有任何反應。這是一個偽協議,其他的偽協議還有 mail:  tel:  file:  等等 詳細請看:HTML5新增的幾個a標籤屬性 移動端。

一般在這種情況下,會給綁定一個事件回調,來執行業務,如:

執行一段空白的javascript語句,返回空或者false值,從而防止鏈接跳轉。跟當前a標籤無關,這段程式碼始終都會執行。

演示如下:

1、設計一個a鏈接的程式碼,讓其點擊的時候執行一個 alert() 函數:

<a href="javascript:alert('不跳轉');">www.w3h5不跳轉</a>

2、此時在頁面上顯示一個a鏈接效果:

3、點擊頁面上的a鏈接,執行結果如上圖:

其他防止頁面跳轉的實現方式:

<a href="#" >test</a>;

點擊鏈接,頁面默認上滾到頁的頂部, 但可以加上 onclick="return false" ,防止上滾到頁的頂部。

<a href="####" >test</a>;

使用2個到4個#,見的大多是 "####" ,也有使用 "#all" 等其他的。一個無意義的標籤指定,不做任何處理。

<a href="javascript:void(0);" >test</a>;

javascript:void(0) 表示一個死鏈接,執行空事件。

聲明:本文由w3h5原創,轉載請註明出處:《a標籤中防止跳轉的href="javascript:;"、"void(0);"等都是什麼意思》 https://www.w3h5.com/post/228.html

Tags: