簡介 :
Elementor Pro的聯絡表單欄位可以設定成「月曆」讓人選日期,但如何做才能讓「今日與過去」的日期都統統不能選呢?
運用範圍 :
有時候在Elementor表單來做簡單的預約功能時,就用的到這樣的需求,怕訪客誤選了過去的日期,造成預約到錯誤的日期引起混亂。
範例 :
請測試一下,請把表單的「日期」那欄點開確認一下過去的日期是否不能選了呢?!
說明 :
我們透過Chrome瀏覽器的開發人員模式可以觀測出若是今日的日期,它的CSS的class會比其它日期多了「.today」,所以我們就寫一段小jQeury程式,把CSS類別是「.today」的「之前的兄弟元素」都加上另一個新的CSS 自訂類別名稱為「.disabled 」,我再替「.disabled 」寫幾句css語法來達到禁選的效果。
若無法理解也沒關係,就照做就行了!
實作 :
付費內容,需支付 : 400 個學習幣
您須先登入會員以使用學習幣與發問功能。總結 :
或許有人會覺得就算不是用做「預約」的目的,也是一樣把過去的日期都隱藏起來好了,因為大部分的目的都是為了選未來某個日期,但有些情境例外,例如是「客訴表單」時,就不能鎖住過去的日期,因為可能該欄是要讓人填「發生時間」,所以使用上仍要看真實情境再決定是否要讓過去的日期「禁選」。