伪触发 input file 的click事件

本文转载自查看原文 2018-03-05 17:28 4723 HTML5/CSS3/ JS

前端在做 input file 美化的时候，通常把 input 定位position 到已美化的按钮最上方 opacity: 0

HTML5时代，已有更方便的方法，点击美化按钮直接触发选择文件事件

<span @click="$refs.inputFile.click()"> 选择文件 </span>
<input type="file" ref="inputFile" style="display:none"  multiple />

我这ref 是VUE里的，理解为id吧，不用VUE的话，直接 id=‘inputFile’ 是一样的

这样简单多了

本站转载的文章为个人学习借鉴使用，本站对版权不负任何法律责任。如果侵犯了您的隐私权益，请联系本站邮箱yoyou2525@163.com删除。

猜您在找 javascript触发input-file的click事件 javascript触发input-file的click事件以input=file方式，获取文件时，在IE下8无法通过某个按钮click事件间接触发input=file的change事件 input的type=file触发的相关事件 input type="file" change事件只触发一次 INPUT[type=file]的change事件不触发问题 click事件触发也有失灵的时候？ React中多次使用 input[type='file'] 上传图片，不触发onChange事件 Input type="file"上传文件change事件只触发一次解决方案 html input的file文件输入框onchange事件触发一次失效解决方法