DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> 關於JavaScript >> javascript:void(0)是什麼意思及href=#與href=javascriptvoid(0)的區別
javascript:void(0)是什麼意思及href=#與href=javascriptvoid(0)的區別
編輯:關於JavaScript     

Javascript中void是一個操作符,該操作符指定要計算一個表達式但是不返回值。

void 操作符用法格式如下:

1. javascript:void (expression)

2. javascript:void expression

expression 是一個要計算的 Javascript 標准的表達式。表達式外側的圓括號是選的,但是寫上去是一個好習慣。

你以使用 void 操作符指定超級鏈接。表達式會被計算但是不會當前文檔處裝入任何內容。

示例-點擊超鏈接不跳轉

1:<a href="####"></a>

2:<a href="javascript:void(0)"></a>

3:<a href="javascript:void(null)"></a>

4:<a href="#" onclick="return false"></a>

點擊鏈接後,頁面會向上滾到頁首,# 默認錨點為 #TOP(實際測試發現 滾動條會滾到頂端)而以上四種方法僅僅表示一個死鏈接都表示是一個死鏈接不會跳轉也不會返回到頂部.

示例-為什麼location.href不自動跳轉?

<a href="javascript:void(0)" onclick="delete('123')">刪除</a>
function delete(id){
 if(confirm("確實要刪除[為什麼location.href不自動跳轉?]嗎?")) {
  location.href="/delete.jsp?id=" + id;
 }
}

以上代碼不管如何檢查都沒有任何問題,而location.href="/delete.jsp?id=" + id;在別的地方都好使,為什麼這段代碼就行呢?

原因是那個void(0)把代碼改成:

<a href="javascript:delete('123')">刪除</a>function delete(id) {
 if(confirm("確實要刪除[為什麼location.href不自動跳轉?]嗎?")) {
  location.href="/delete.jsp?id=" + id;
 }
}

我們發現,頁面立即就跳轉了,能正常刪除相應的數據.為什麼呢?

因為void是一個操作符,會計算一個表達式,但不會返回值,當然也不會改變當前頁面的任何內容,也就不會正常的跳轉.

說明

void 運算符對表達式求值,並返回 undefined。在希望求表達式的值,但又不希望腳本的剩余部分看見這個結果時,該運算符最有用。

鏈接(href)直接使用javascript:void(0)在IE中可能會引起一些問題,比如:造成gif動畫停止播放等,所以,最安全的辦法還是使用“#”。為防止點擊鏈接後跳轉到頁首,onclick 事件 return false即可。

PS:href=#與href=javascriptvoid(0)的區別

#"包含了一個位置信息 
默認的錨點是#top 也就是網頁的上端
而javascript:void(0)  僅僅表示一個死鏈接 
這就是為什麼有的時候頁面很長浏覽鏈接明明是#可是跳動到了頁首
而javascript:void(0)
則不是如此 所以調用腳本的時候最好用void(0)
或者<input onclick> <div onclick>等 

打開新窗口鏈接的幾種辦法

1.window.open('url')

2.用自定義函數       

<script>   
function openWin(tag,obj)   
{    
obj.target="_blank";    
obj.href = "Web/Substation/Substation.aspx?stationno="+tag;    
obj.click();   
}   
</script> 
<a href="javascript:void(0)" onclick="openWin(3,this)">LINK_TEST</a> 
window.location.href="" 

-------------------------------------------------------------------------------  

如果是個# ,就會出現跳到頂部的情況,個人收藏的幾種解決方法:

1:<a href="####"></a> 
2:<a href="javascript:void(0)"></a>
3:<a href="javascript:void(null)"></a>
4:<a href="#" onclick="return false"></a> 
5:<span style="cursor:hand"></span>(好像在FF中不能顯示)

-------------------------------------------------------------------------------

以上內容是小編給大家介紹的javascript:void(0)是什麼意思及href=#與href=javascriptvoid(0)的區別,希望對大家有所幫助。

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved