situation
默認input[type=file]太醜,做了個美化的button,對其添加click事件後發現只能選擇文件,而點擊提交按鈕是無法真正上傳文件的
task
進行僞裝,當點擊button時實際上點在input[type=file]上
action
通過CSS,使input[type=file]
- 位於按鈕上層
- 大小與button相同
- opacity設爲0,使其透明
HTML5拓展
增加multiple屬性後,一次可上傳多個文件
<form action="" method="">
<input type="file" name="" multiple="multiple" />
<input type="submit" />
</form>
webkitdirectory可上傳文件夾,但僅Chrome有效
<input type="file" id="file_input" webkitdirectory />