三、文件上傳組件的創(chuàng)新 【瘦身法】

標(biāo)準(zhǔn)的文件上傳組件是由“輸入框(偽)+瀏覽按鈕+提交按鈕”組成。之說以稱之為“偽輸入框”是因為它主要承擔(dān)顯示文件路徑的作用，于是Firefox下點(diǎn)擊這個輸入框是開始文件選擇操作，chrome更是把偽輸入框改造成了按鈕，還原控件最原始的作用。

使用標(biāo)準(zhǔn)文件上傳組件經(jīng)常會出現(xiàn)兩個提交按鈕，以上圖為例，最經(jīng)常的誤操作就是：選完文件后，直接點(diǎn)擊“保存頭像設(shè)置”，于是杯具了。

Gmail附件上傳的設(shè)計對文件上傳組件做了兩次瘦身手術(shù)。

過去的gmail附件上傳步驟是：1、點(diǎn)擊“添加附件”(點(diǎn)擊后出現(xiàn)一個不帶提交按鈕的上傳組件)，2、選擇文件(選完后自動開始上傳)。去掉了那個提交按鈕。

現(xiàn)在的gmail附件上傳步驟是：1、點(diǎn)擊“添加附件”(點(diǎn)擊后自動開始上傳，且有上傳進(jìn)度條)。去掉了輸入框和提交按鈕，只剩下一個瀏覽按鈕，上傳只需要一次點(diǎn)擊操作。