實(shí)現(xiàn)原理很簡單，就是用一個text input做初始化日期展示，右邊的向下箭頭用label實(shí)現(xiàn)，設(shè)置for屬性為text input的id。這樣點(diǎn)擊label時自動聚焦到input。text input獲取焦點(diǎn)后立即將自己的type改為date，這樣就有date picker的行為了。失去焦點(diǎn)后再改回type=”text”，依舊顯示text input。如果僅僅是這樣，還有個小問題，就是當(dāng)input是text類型的時候，直接點(diǎn)擊input，雖然type變成date了，但并不會觸發(fā)picker，而是需要再次點(diǎn)擊。這顯然不符合要求，需要繼續(xù)改善。受到前面的label啟發(fā)，咱們可以在input上方覆蓋一個透明的label，同樣設(shè)置for屬性為input的id。這樣就不能直接點(diǎn)擊到input，而是上層的label，同樣會觸發(fā)picker。至此，貌似完美解決了問題。但是且慢，在iPhone上用瀏覽器打開，發(fā)現(xiàn)無法觸發(fā)picker！這是要鬧哪樣？無奈，只好在label上再監(jiān)聽點(diǎn)擊事件，用代碼將input改為date，同時讓它獲取焦點(diǎn)。這回應(yīng)該可以了吧？自己試試