1. 程式人生 > 實用技巧 >a標籤阻止預設跳轉行為事件

a標籤阻止預設跳轉行為事件

a標籤有預設的點選事件,點選事件的預設行為是跳轉到href指定的某一個網址

組織預設跳轉事件行為

  1.javascript:void(0) 空處理    void為關鍵字

<!-- void 它只進行計算或者執行,但是沒有返回值 -->
    <a href="javascript:void(0)">點選跳轉</a>    <!--當點選跳轉的時候,就會告訴a標籤,當前的解析是用js來解析的-->
    <br><br>
    <a href="Javascript:void(alert('不跳轉'))">警告警告</a>     <!--不跳轉 但是會彈出一個提示框-->

  2.javascript:;

 <a href="javascript:;"></a>   <!-- 既不跳轉,也沒提示 -->

  3.使用手動的方式給a標籤一個點選事件來阻止跳轉,然後再點選事件中新增return false這個屬性

    <a href="return false" onclick="return false">點選跳轉</a>

  4.e.preventdefaule()  相當於button中要提交的submit,不讓它提交給這個屬性就可以阻止它的提交

<a href="http://wwww.baidu.com
" id="test">跳轉</a> var test = document.getElementById("test"); function Default(e){ // 注意這裡的迴圈語句是沒有大括號的,因為他不會報錯,而且有了大括號是無法阻止跳轉的 if (e && e.preventDefault) e.preventDefault(); else window.
event.returnValue = false; } test.onclick = function(e){ Default(e) }

注意點:如果href屬性是錨點,它是不管在哪裡只要點選了跳轉就會跳轉到選單欄或者頂部