【juincen】Web中图片上传处理 jQuery+Ajax+SpringMVC
来源:互联网 发布:专业足球数据网站 编辑:程序博客网 时间:2024/06/16 11:08
今天做项目有个需求,页面上需要上传一个图片,之前解决了一次,没有记下来。
在前台用户先选择一张图片,然后可以预览,再上传,我是这样解决的。
预览:
html里面有一个普通的input标签,id:uploadFile
<input type="file" id="uploadFile" />
还有一个可以预览的img标签,这个img现在并没有src属性,id:imgpreview
<img width="100" height="100" id="imgpreview" />
然后在js里面监听这个input的change事件(当选择了图片之后出发)
/*** 选择文件后出发执行*/$('#uploadFile').change(function () { // 获取FileList的第一个元素 var f = document.getElementById('uploadFile').files[0]; var src= window.URL.createObjectURL(f); $("#imgpreview").attr("src",src); console.log(src);//看看这个可以浏览的是个什么东西});
然后就可以实现预览了!
上传:
(未完待更新~)
阅读全文
0 0
- 【juincen】Web中图片上传处理 jQuery+Ajax+SpringMVC
- 【juincen】Web中图片上传处理 jQuery+Ajax+SpringMVC
- AJAX+JQuery+SpringMVC实现图片上传
- ajax图片的上传和裁剪springmvc后台接受处理
- jquery Ajax 上传图片
- springmvc图片上传、jquery 图片上传预览
- SpringMVC中Ajax异步上传图片的方法
- springmvc上传图片的处理
- jquery ajax图片上传 springmvc ajaxFileUpload 报这错jQuery.handleError is not a function
- jQuery php ajax图片上传
- 使用JQuery Ajax 在表单中检查图片上传
- jquery-ajax+springMVC实现文件上传
- springmvc ajax无刷新图片上传
- ajax无刷新上传图片,基于springMVC
- SpringMVC+AJAX+MultipartFile上传单个图片
- jquery中ajax请求过程显示正在处理的图片
- Jquery uploadify 上传文件 springmvc 接收处理
- web uploader上传图片 springmvc 后台
- Vue自定义图片懒加载指令v-lazyload详解
- SSM_OA_MYbatis配置
- 从github上下载没有用SSH KEY(为什么?)
- 不要62 HDU
- CSS(中国互联网安全领袖峰会)大会见解
- 【juincen】Web中图片上传处理 jQuery+Ajax+SpringMVC
- Content Delivery
- Object.defineProperty
- GOF23种模式
- Coin_Change
- dataSource(阿里巴巴)的配置
- 错误代码为1366的MySQL错误
- JAVA 求最大公因数--欧几里得算法
- skynet源码分析(9)--LUA C API