第一種： <a href = " javascript: void ( 0 ); ">百度</a> 或者<a href = " javascript:; ">百度</a>

測試：（可行）

<a href="javascript:void(0);" onclick="myjs()">百度</a>
<a href="javascript:;" onclick="myjs()">百度1</a>
<script type="text/javascript">
    function myjs(){
        alert("a標籤預設事件被阻止，執行js函式");
    }
</script>
 

第二種：<a href = " # ">百度</a> (最常見的，但是點選後頁面會返回到頂部，不可用)；所以又有了<a href = " ## ">百度</a>或者<a href = " #! ">百度</a>

測試：

<div id="test" style="width: 1000px; height: 1300px; background: rgb(56,132,63)"></div>
<a href="#" onclick="myjs()">百度</a> <!--不可行（執行js函式後頁面會返回到頂部）-->
<a href="##" onclick="myjs()">百度1</a> <!--測試未發現問題-->
<a href="#!" onclick="myjs()">百度2</a> <!--測試未發現問題-->
<script type="text/javascript">
    function myjs(){
        alert("a標籤預設事件被阻止，執行js函式");
    }
</script>
 

第三種： e.preventDefault();阻止預設事件(不支援IE)，IE中用window.event.returnValue = false; 阻止預設事件

測試：（可相容IE）

<a id="test" href="http://www.baidu.com">百度</a>
<script type="text/javascript">
    //宣告並獲取element
    var test = document.getElementById("test");
    //阻止預設事件函式
    function stopDefault(e) {
        if (e && e.preventDefault)
            e.preventDefault();
        else
            window.event.returnValue = false; //相容IE
    }
    //自定義函式
    function myjs(){
        alert("阻止預設事件，執行自定義函式");
    }
    //element點選阻止預設事件並執行自定義函式
    test.onclick =  function(e){
        stopDefault(e);
        myjs();
    }
</script>