Event Handler 裡的 "return"

[gugod]

昨天碰到一個問題。在 onclick event handler 裡面的
"return"，最好還是完全寫上去，不要忽略比較好。不然的話，在各種瀏覽器裡會有不同的行為。比如說：

var h = function(ev) {
h2();
}

var h2 = function(ev) {
alert("Hi");
return false;
}

像這樣，h() 直接呼叫 h2()，而沒有寫 return
的的話，它的傳回值就是
undefined。也就是它沒有傳回值的意思。做為 onclick
handler 的時候，就無法停止處理 <a>
元素本身的行為。這時候會有一個很有意思的情況。一般來說，為了方便，對於點下去要呼叫某函式的
<a> 來說，我們會這樣寫：

<a href="#" onclick="return h();">Click Me</a>

沒有 href
屬性的話，瀏覽器不會讓它變成可以點的東西。所以只好用個
href="#"
來充數。這麼一來會出現一個很有意思的事。比如說本來的
URL 是：

http://foo.org/test.html

在 Click 之後，會出現 "Hi" 的 alert，然後 URL 變成

http://foo.org/test.html#

也就是說 <a>
原本的效果仍在。一般來說這樣不會有什麼大問題，因為從
test.html 走到 test.html#，瀏覽器可能不會
reload。不過如果本來的 URL 是這樣：

http://foo.org/test.html#edit

那就會有點問題，因為 #edit 的部份，在點了 <a>
之後，就會變成 "#"。畫面應該會捲走，並且在 IE
上，從 #edit 走到 # 的話，有時會有 reload
的動作發生。如果有個 onload 函式在偷看 URL
來做一些特別處理的話，那問題就會更多。

要讓 URL 保持不動的話，就必需確定 Handler 要有 return
false。

var h = function(ev) {
h2();
return false;
}

如果是要在其他函式決定傳回值的話，也還是一樣要明確寫出
'return'：

var h = function(ev) {
return h2();
}

以上。

Cheers,
Kang-min Liu