ie6 javascript:void(0);(轉)


遇到過幾次這種問題,現在總結一下。

代碼:

 <a onclick="window.location.href='http://www.google.com'" href="javascript:void(0);">google</a>

這段代碼在主流的瀏覽器里面都沒問題,但是在IE6下就會出現不能跳轉的現象。

經過一翻排查,發現綁定的事件都會執行,是由於DOM本身的冒泡事件所以會最后執行href屬性內的javascript:void(0);導致的。

a標簽

a標簽本來就是用來進行頁面跳轉的標簽,其運行機制是告訴瀏覽器URL地址並且跳轉。當然,我們可以在href屬中直接執行javascript。

代碼:

<a href="javascript:alert('Hello!');">Say Hello</a>

Say Hello

這里由於javascript執行了alert函數,但是其返回的是null。所以a標簽沒有執行任何動作。

javascript:void(0);

void(arg);可以理解為永遠返回null的函數,但是其參數不能為空。其參數可以為任意的表達式甚至是函數。

代碼:

<a href="javascript:void(name = 'will'); alert('Hello ' + name);">Say Hello</a>

Say Hello

對IE6運行的猜想

IE6會先運行DOM本身綁定的事件,如onclick;如果沒有阻止冒泡,則會順序執行href屬性。而void(0);正是不需要執行任何事 件,則IE6告訴瀏覽器不執行任何事件(覆蓋之前的動作),並且終止冒泡相當於return false;於是瀏覽器沒有執行任何動作。

這樣只要在onclick事件內阻止冒泡事件即可。

經過改進的代碼為:

 <a onclick="window.location.href='http://www.google.com' return false;" href="javascript:void(0);">google</a>

這樣在IE6下就可以正常運行了。

其他方法

當然可以不使用javascript:void(0);而改使用#也可以避免,href屬性內的#本來的意思就是錨點#name所以當不指定任何錨時自然會到頁面頂端並在URL后加入Hash symbol。

這里對於錨還有一個比較特殊的用法

當href屬性的值是錨點時,但是又找不到該錨點,則相當於返回null,所以可以使用##來代替javascript:void(0);

當然前提是你的頁面不要有錨點的名字是#的喲~


免責聲明!

本站轉載的文章為個人學習借鑒使用,本站對版權不負任何法律責任。如果侵犯了您的隱私權益,請聯系本站郵箱yoyou2525@163.com刪除。



 
粵ICP備18138465號   © 2018-2025 CODEPRJ.COM