jQuery preventDefault, stopPropagation, and return false

Javascript Event 是某些狀況的發生而產生的因應，例如系統面的網頁載入完成或者使用者面的點擊了連結，有些反應是有「副作用」的，像是點擊了連結會開啟新的網址，或者按下 Submit 按鈕將 Form 送出，當然也有些反應不會有副作用，像是滑鼠移動或是載入網頁。

這些「副作用」是可以被制止的。

$('a').click(function(e){
    e.preventDefault();
});

只要這樣，preventDefault 就可以讓所有連結失效，只能點，但不會開啟該連結。


Javascript Event 還有一個特色：Bubbling，就是 Event 會向外層（父層）傳遞，每個 listen 該 Event 型別的父層物件也都會被觸發 Event Handler。

當然，這個「冒泡作用」也是可以被制止的。

$('a').click(function(e){
    e.stopPropagation();
});

這樣 a 所有的父層物件都不會收到 click event。

「副作用」 與「冒泡作用」是獨立的兩種行為，制止其中一種並不會影響另一種，例如對 a 呼叫 preventDefault() 制止其「副作用」，但 click event 仍會往外傳到所有父層物件，反之，對 a 呼叫 stopPropagation() 制止其「冒泡作用」，但點擊 a 仍會開啟該連結。

return false

只要在 jQuery 的 Event handler  回傳 false，就同時具有以上兩種效果。

$('a').click(function(e){
    return false;
});

 效果等同於

$('a').click(function(e){
    e.preventDefault();
    e.stopPropagation();
});