1、首先呢,我们要在前端定义一个<input type="file" id="upload"></input>的标签

2、在写js

var formdata=new FormData();//用来封装数据
var fileValue=$('#uploadPic').val();//获取文件
if(fileValue.length>0){//判断文件是否大于0,如果大于0,则代表有数据,则进行下一步,否则进入另外一个ajaxformdata.append("file",$('#uploadPic')[0].files[0]);$.ajax({url:"../bizAlert/delBizAlert",type: "POST",async: false, processData: false,   // jQuery不要去处理发送的数据contentType: false,   // jQuery不要去设置Content-Type请求头data:formdata,success: function (data) {console.log(data);},error:function(data){console.log(data.statusText);},complete: function (XHR, TS) {XHR = null} //回收资源});
}else{$.ajax({url:"../bizAlert/delBizAlert2",type: "POST",async: false,processData: false,   // jQuery不要去处理发送的数据contentType: false,   // jQuery不要去设置Content-Type请求头data:formdata,success: function (data) {console.log(data);},error:function(data){console.log(data.statusText);},complete: function (XHR, TS) {XHR = null} //回收资源});

3、后台

@RequestMapping(value = "delBizAlert", method = RequestMethod.POST)public Result<BizAlert> delBizAlert(@RequestParam("dealResult") String dealResult,@RequestParam("dealIdea") String dealIdea,@RequestParam("file") MultipartFile files) {Result result = new Result();return result;}

ok了,后台就接收到前端的图片数据了。

js实现图片上传功能,后台为Java相关推荐

  1. 原生js实现图片上传功能

    在项目中用到了原生的上传功能,html5代码如下 <div class="uploadimg"><div v-for="(item, index) in ...

  2. js jq 图片上传功能

    js jq 图片上传功能 <input type="file" onchange="uploadHandler(this)"><img src ...

  3. js实现图片上传预览功能

    js实现图片上传预览功能 很多业务场景下,我们需要在用户上传图片前,先预览待上传的图片 <body><input type="file"><img s ...

  4. 如何上传图片到fileupload空间_如何用原生js写图片上传组件v2.0(还有新版本)?...

    js图片上传组件: 基本要求: 1.上传的图片可预览,可删除,可被覆盖更新 2.要求图片格式为jpg和png,大小不能超过2M 新加需求: 1.模拟回显,可用本地存储(实际上的回显是通过后台传过来的u ...

  5. js实现图片上传预览及进度条

    js实现图片上传预览及进度条 原文js实现图片上传预览及进度条 最近在做图片上传的时候,由于产品设计的比较fashion,上网找了比较久还没有现成的,因此自己做了一个,实现的功能如下: 1:去除浏览器 ...

  6. ckeditor java 上传_java使用CKEditor实现图片上传功能

    java如何使用ckeditor实现图片上传功能,具体内容如下 1.根据实际需要下载指定的ckeditor 2.删除文件ckeditor/plugins/image/dialogs/image.js预 ...

  7. (转)淘淘商城系列——实现图片上传功能

    http://blog.csdn.net/yerenyuan_pku/article/details/72808000 上文我们使用FastDFS-Client进行了简单的文件上传操作测试,淘淘商城项 ...

  8. ckfinder php 配置,PHP中Ckeditor+Ckfinder配置图片上传功能_PHP教程

    从标题来看我们知道Ckeditor不支持图片上传功能,它是需要一个组件Ckfinder才可以支持上传图片, 本文章就来详细的介绍了如何配置Ckeditor+Ckfinder实现图片上传的功能. 第一: ...

  9. 织梦dedecms广告管理增加广告图片上传功能

    织梦的广告位管理是一个不错的插件内部插件,但是dedecms的广告管理功能稍微有点次,不能直接上传图片生成图片链接 本文就是在dedecms广告管理原有的基础上增加广告图片上传功能. 安装方法,对应自 ...

最新文章

  1. iOS 线程安全之@synchronized的用法
  2. Ubuntu 将应用程序 固定到快快速启动栏(以Sublime为例)
  3. 我的自我介绍以及决心书
  4. Python3 关键字nonlocal和global的用法与区别
  5. 【C/C++】代码换行问题
  6. shell远程执行命令
  7. 8天学通MongoDB——第四天 索引操作
  8. 一位 90 后程序员的自述:如何从年薪 3W 到 30W
  9. python 控制 cmd 命令行颜色
  10. 理解Marx-4 马克思的第一次思想转变
  11. PR剪辑视频工作流程 大剪辑师分享的高级视频编辑技巧
  12. 饿了么小程序容器首屏秒开优化实践
  13. Centos 修改主机名称
  14. 计算机病毒模块测试题,计算机病毒分类测试题集
  15. 颠覆者-读周鸿祎新书
  16. Deepmind讲座:深度学习中的记忆和注意力 注意力机制发展史与详解
  17. OpenCV-颜色通道的分离、合并
  18. Hibernate安装教程
  19. 图像算法工程师学习内容
  20. 第十三届蓝桥杯大赛软件赛省赛(C/C++ 大学A组)

热门文章

  1. LA 4394 刷字符串(区间dp)
  2. 移动端横屏/强制横屏
  3. 信号完整性--串接22ohm源端电阻或者接收端接上下拉匹配电阻
  4. centos 安装 Go环境
  5. 同源跨窗口通信:网易云音乐不同标签页打开同一页面,暂停原先标签页音频播放
  6. 情感识别相关数据集总结
  7. c语言中预处理都有哪些类型,c语言中预处理命令都有哪些
  8. 如何让消息队列达到最大吞吐量?
  9. 吞吐量、QPS、并发数等概念
  10. Matlab map工具箱的使用