javascript:void(0)的問題

javascript:void(0)的問題

 

最近看了好幾個關於<a>標籤和javascript:void(0)的帖子，謹記於此，以資查閱。 注：如下代碼未經全面測試，但每一種方法可能會出現的狀況都基本作了說明。
在作頁面時，若是想作一個連接點擊後不作任何事情，或者響應點擊而完成其餘事情，能夠設置其屬性 href = "#"，可是，這樣會有一個問題，就是當頁面有滾動條時，點擊後會返回到頁面頂端，用戶體驗很差。
目前有以下幾種解決辦法： 1)點擊連接後不作任何事情

1.<a href="javascript:void(0);" >test</a>
2.<a href="javascript:;" >test</a>
3.<a href="####" >test</a> //使用2個到4個#，見的大可能是"####"，也有使用"#all"等其餘的

2)點擊連接後，響應用戶自定義的點擊事件

1.<a href="javascript:void(0)" onclick="doSomething()">test</a>
2.<a href="#" onclick="doSomething();return false;">什麼問題都解決了,包括瀏覽器不兼容問題</a> //或者直接使用href=""
3.<a href="#" onclick="alert();event.returnValue=false;">test</a>

說明： 1.javascript:void(0)這種僞協議，少寫的好，若是你看過一些web標準的書就知道爲何了。（不懂，原話摘的，暫作記錄） 2.連接（href）直接使用javascript:void(0)在IE中可能會引發一些問題，好比：形成gif動畫中止播放等，因此，最安全的辦法仍是使用「####」。爲防止點擊連接後跳轉到頁首，onclick事件return false便可。 3.若是僅僅是想鼠標移過，變成手形，可使用

<span style="cursor:pointer" onclick="foo()">Click Me!</span>

void是javascript的操做符，意思是：只執行表達式，但沒有返回值， void 操做符用法格式以下：

1. javascript:void (expression)
2. javascript:void expression

爲了程序風格良好，建議使用第二種帶上括號的 咱們可使用void操做符指定超級連接，如javascript:void(document.form.submit())。表達式會被計算可是不會在當前文檔處裝入任何內容，void(0)計算爲0，但在JavaScript上沒有任何效果，也就是說 <a href="javascript:void(0)">的效果同<a href="javascript:void(1)">的效果是同樣的。 關鍵是隻要知道void是javascipt自身的操做符，它表示的是隻執行表達式，但沒有返回值！
另外頁面會自動調回頂端，是由於"#"默認的瞄點位置是top，因此會出現這種狀況。