a標籤如何使用href屬性與onclick事件

這次帶給大家a標籤如何使用href屬性與onclick事件，a標籤如何使用href屬性與onclick事件的注意事項有哪些，以下就是實戰案例，一起來看一下。

a標籤主要用來實現頁面跳轉，可以透過href屬性實現，也可以在onclick事件裡實現。

<a onclick="window.location.href=&#39;www.php.cn&#39;" href="javascript:void(0);">PHP中文网</a>

這段程式碼在主流瀏覽器裡都沒問題，但在IE6下會出現不能跳轉的問題。這究竟是什麼原因呢？

javascript:void(0);

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

<a href="javascript:void(name = &#39;PHP中文网&#39;); alert(name);">测试</a>

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

<a onclick="window.location.href=&#39;http://www.php.cn&#39;;return false;" href="javascript:void(0);">PHP中文网</a>

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

另外還有一種方法就是不使用javascript:void(0);而改使用#也可以避免，href屬性內的#本來的意思就是錨點#name所以當不指定任何錨點時會到頁面頂端。 #是有特定意義的，預設是#top，如果#後面有內容會被認為是一個標籤而從頁面找到對應標籤跳到該處，找不到會跳到頁首，如果不想讓跳到，可以使用

，

就是一個無意義的標籤指定。

相信看了這些案例你已經掌握了方法，更多精彩請關注php中文網其它相關文章！

相關閱讀：
css3中的漸進增強和優雅降級如何使用

css3的calc在less編譯時如果被運算應該如何解決

怎麼用H5的WebGL實作3D虛擬機房的漫遊動畫

#####

以上是a標籤如何使用href屬性與onclick事件的詳細內容。更多資訊請關注PHP中文網其他相關文章！