點選連結取消跳轉效果

admin發表於2018-11-10

有時候僅希望將連結<a>作為一個按鈕使用，預設狀態下，點選連結會出現跳轉效果。

下面通過程式碼例項介紹一下如何取消連結的跳轉動作。

程式碼例項如下：

[HTML] 純文字檢視 複製程式碼執行程式碼
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="author" content="http://www.softwhy.com/" />
<title>螞蟻部落</title>
<script>
window.onload=function(){
  let olink=document.getElementById("link");
  olink.onclick=function(){
    if(confirm("是否刪除?")){
      alert("檔案被刪除");
    }
    return false;
  }
}
</script>
</head>
<body>
<a href="#" id="link">是否刪除</a>
</body>
</html>

上述程式碼中，連結只會當做一個普通按鈕使用。

原因是在連結的點選事件中使用return false語句，可以取消連結的預設動作。

具體可以參閱JavaScript return false一章節。 

相關文章