2013年8月5日 星期一

event.preventDefault()跟return false的差別是?

不知道大家知不知道event.preventDafault()跟return false的差別是什麼?
有的話歡迎一起討論,可以一起長知識XD

這個問題很有趣,是我這幾天工作突然在stackoverflow看到有人發問,特別把網址存起來想說有時間再回來看。老實說我也不是很清楚這兩者的真正差別(一整個亂用XD)。

我只記得以前自己看書做網頁上的某個表單送出,會先自己寫個驗證,哪個欄位沒有填就要有個alert,然後不能讓表單送出,所以那時候學會了return false。:p

至於preventDefault()是我在前一間公司學到的經驗,就是我在一個有好幾個父元素的某個標籤(ex.<a>),綁定了click事件,結果並沒有如我預期發生,產生了一些詭異的現象,那時候還以為是syntax的bug,因為那時候不懂冒泡事件。

by the way, 大家可以參考我去年寫的note(><):


先不管冒泡事件,拉回正題繼續討論event.preventDafault v.s return false!
大家可以參考一下這篇文章 :
event.preventDefault() vs. return false
我大概用中文解釋一下這篇的內容:

  1. event.preventDefault()會阻擋預設要發生的事件.
  2. event.stopPropagation()會阻擋發生冒泡事件.
  3. 而return false則是前面兩者的事情他都會做:
    • 他會做 event.preventDefault();
    • 他會做 event.stopPropagation();
    • 停止callback function的執行並且立即return回來


不要總是偏好使用某一種方式,什麼時候該用什麼,還是要視你的目標跟預期狀況而決定。

相關參考:

沒有留言:

張貼留言

若你看的文章,時間太久遠的問題就別問了,因為我應該也忘了... XD

Vue multiselect set autofocus and tinymce set autofocus

要在畫面一進來 focus multiselect 的方式: 參考: https://jsfiddle.net/shentao/mnphdt2g/ 主要就是在 multiselect 的 tag 加上 ref (例如: my_multiselect), 另外在 mounted...