在編寫功能時,遇到一個很有意思的事情,後來經過思索就解決了這個問題。 這個功能的需求是點擊一個按鈕,彈出對話框,其他部分籠罩一層灰色,點擊灰色後彈出框消失,如果只是這樣就比較好實現,但還有其他需求,那就是這個按鈕所在的這個整體內容,點擊它之後會進入另一個頁面,所以我的思路是使用事件冒泡,判斷是點擊了 ...
在編寫功能時,遇到一個很有意思的事情,後來經過思索就解決了這個問題。
這個功能的需求是點擊一個按鈕,彈出對話框,其他部分籠罩一層灰色,點擊灰色後彈出框消失,如果只是這樣就比較好實現,但還有其他需求,那就是這個按鈕所在的這個整體內容,點擊它之後會進入另一個頁面,所以我的思路是使用事件冒泡,判斷是點擊了按鈕還是內容的其他部分來決定是彈出對話框還是進入另一個頁面,在點擊彈出框以外的籠罩層,彈出框和籠罩層就消失,到這一步為止,都實現得很順利,但在測試時有意思的事情就出現了,在點擊灰色籠罩層時,點擊部分對應到內容的話,就會進入到另一個頁面,這說明點擊籠罩層後也會相應點擊到籠罩層下麵的內容,那麼這個事件會影響到兩部分,現在只需要實現這個點擊事件對籠罩層有作用,對籠罩層下麵的內容不起作用,那麼這個時候就需要在實現了籠罩層的點擊後取消這個事件的預設行為,使其沒有點擊功能,這樣就不會點擊籠罩層下麵的內容使得進入另一個頁面了,所以就需要用到preventdefault()這個方法,即調用event.preventdefault()就可以使事件失去預設行為,event就是事件。