最近项目要做那个什么,文件上传和图片上传,只能用 input file 了,这个input file 有点丑,需要改样式。
我是这么做的:
<div class="btn">
<input type="button" name="upload" id="upload" value="上傳" />
<input type="text" name="filename" id="filename" value="" />
<input type="file" class="input-file" id="a" style="display: none;"/>
</div>
<div>
</div>
<script type="text/javascript">
document.getElementById("upload").onclick=function(){
document.getElementById("a").click();
}
document.getElementById("a").onchange=function(){
var value = this.value;
document.getElementById("filename").value=value;
}
</script>
首先把input file display none 隐藏起来,然后呢我再把按钮点击后触发Input file的点击。
恩 然后用一个 input text 来放 input file 的value Ok 就是这个样子,简单点 需要的样式简单点,做个前端很心累,样式改变很复杂。
好了 至于在线实时预览和 上传压缩 这个稍后再讲。