文件上传按钮自动上传加input_file美化

简介:

自己总结了下:文件上传按钮自动上传 + input_file美化

不好,经测试发现不支持谷歌浏览器

 

 

 
  1. <script>     
  2.       function submitform(){     
  3.           document.form01.action="upload.php";     
  4.           document.form01.submit();     
  5.       }    
  6. </script>     
  7. <form name="form01" method="post" enctype"multipart/form-data">   
  8. <input type="hidden" name="xx" value="1" />   
  9. <!-- 选择文件(自动上传)<input type= "file" name="upfile" onchange="submitform()" />  -->  
  10. <input type=file id=a1 style"display:none" onchange="submitform()">  
  11. <input type=button value="浏览自动上传" onclick"a1.click()"><br />  
  12. <input type="image" src="v_submit.jpg" onclick"a1.click()">   
  13. </form>    
  14. <!--此form不能单纯的提交[上传文件]一个input,否则post不成功-->   





本文转自许琴 51CTO博客,原文链接:http://blog.51cto.com/xuqin/935216 ,如需转载请自行联系原作者


相关文章
|
18天前
|
API
【sgUpload】自定义组件:自定义上传组件,支持上传文件夹及其子文件夹文件、批量上传,批量上传会有右下角上传托盘出现,支持本地上传图片转换为Base64image。
【sgUpload】自定义组件:自定义上传组件,支持上传文件夹及其子文件夹文件、批量上传,批量上传会有右下角上传托盘出现,支持本地上传图片转换为Base64image。
|
4月前
ant-design Upload上传组件使用 编辑功能图片回显
ant-design Upload上传组件使用 编辑功能图片回显
167 0
|
5月前
LayUI upload上传组件上传文件的两种方式
LayUI upload上传组件上传文件的两种方式
382 0
|
1月前
|
前端开发
el-upload上传一张图片后显示缩略图并隐藏添加图片按钮
el-upload上传一张图片后显示缩略图并隐藏添加图片按钮
30 1
原生input输入框实现上传文件
原生input输入框实现上传文件
|
4月前
|
Java 应用服务中间件 Android开发
UEditor自定义图片/文件上传路径与回显
UEditor自定义图片/文件上传路径与回显
79 0
|
8月前
|
JavaScript
Vue 监听输入框(input、textarea ...)粘贴事件获取图片、视频、文件、文件夹
Vue 监听输入框(input、textarea ...)粘贴事件获取图片、视频、文件、文件夹
612 0
|
9月前
element组件库使用笔记---上传图片+回显+预览1.0
element组件库使用笔记---上传图片+回显+预览1.0
38 0
|
JavaScript 前端开发
css:隐藏input file标签并触发点击上传文件事件
css:隐藏input file标签并触发点击上传文件事件
458 0
css:隐藏input file标签并触发点击上传文件事件
|
缓存 前端开发 JavaScript
百度编辑器ueditor,单个图和多图上传文件大小限制以及文字提示修改
百度编辑器ueditor,单个图和多图上传文件大小限制以及文字提示修改
998 0