js实现图片上传功能,后台为Java
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相关推荐
- 原生js实现图片上传功能
在项目中用到了原生的上传功能,html5代码如下 <div class="uploadimg"><div v-for="(item, index) in ...
- js jq 图片上传功能
js jq 图片上传功能 <input type="file" onchange="uploadHandler(this)"><img src ...
- js实现图片上传预览功能
js实现图片上传预览功能 很多业务场景下,我们需要在用户上传图片前,先预览待上传的图片 <body><input type="file"><img s ...
- 如何上传图片到fileupload空间_如何用原生js写图片上传组件v2.0(还有新版本)?...
js图片上传组件: 基本要求: 1.上传的图片可预览,可删除,可被覆盖更新 2.要求图片格式为jpg和png,大小不能超过2M 新加需求: 1.模拟回显,可用本地存储(实际上的回显是通过后台传过来的u ...
- js实现图片上传预览及进度条
js实现图片上传预览及进度条 原文js实现图片上传预览及进度条 最近在做图片上传的时候,由于产品设计的比较fashion,上网找了比较久还没有现成的,因此自己做了一个,实现的功能如下: 1:去除浏览器 ...
- ckeditor java 上传_java使用CKEditor实现图片上传功能
java如何使用ckeditor实现图片上传功能,具体内容如下 1.根据实际需要下载指定的ckeditor 2.删除文件ckeditor/plugins/image/dialogs/image.js预 ...
- (转)淘淘商城系列——实现图片上传功能
http://blog.csdn.net/yerenyuan_pku/article/details/72808000 上文我们使用FastDFS-Client进行了简单的文件上传操作测试,淘淘商城项 ...
- ckfinder php 配置,PHP中Ckeditor+Ckfinder配置图片上传功能_PHP教程
从标题来看我们知道Ckeditor不支持图片上传功能,它是需要一个组件Ckfinder才可以支持上传图片, 本文章就来详细的介绍了如何配置Ckeditor+Ckfinder实现图片上传的功能. 第一: ...
- 织梦dedecms广告管理增加广告图片上传功能
织梦的广告位管理是一个不错的插件内部插件,但是dedecms的广告管理功能稍微有点次,不能直接上传图片生成图片链接 本文就是在dedecms广告管理原有的基础上增加广告图片上传功能. 安装方法,对应自 ...
最新文章
- Linux shell脚本基础学习
- RocketMq是什么
- 云原生微服务架构的技术内涵
- csdn自定义模块backup
- 编写python程序一年365天_编写第一个Python程序
- 建立适合大数据成功的团队
- matlab遍历文件制作自己的数据集 .mat文件
- 11-2 操作系统发展
- corosync/openais+pacemaker+drbd+web实现高可用群集
- 确保已在无线网络上启用dhcp服务器,WiFi无线网络提示未启用DHCP无法上网的解决方法教程[多图]...
- python实现范围框跟随_调整边界框的大小和位置,同时使其稍微居中
- 嵌入式linux驱动笔试,嵌入式Linux驱动工程师/BSP开发工程师面试笔试题集锦
- kali 安装grub theme
- C#中Font类详解
- android sqlite 保存图片,android-如何将图像在Sqlite数据库中另存为blob?
- 基于SSM和Vue的旅游网和旅游管理系统
- 现钞和现汇有什么区别??
- rf 433/868MHZ sub-1g 无线通信知识系列(5):SX1208数据传输时间 FSK 波特率等相关计算
- Java判断某天是这一年的第几天
- 【BZOJ】1665: [Usaco2006 Open]The Climbing Wall 攀岩(spfa)
热门文章
- pareto最优解程序_求多目标优化问题Pareto最优解集的方法
- 【入门级】学习卡尔曼滤波
- 公有iot私有iot架构_玩洋葱Omega IoT设备在OLED屏幕上显示实时血糖
- 创意电子学-小知识:研究继电器
- win7下搭建小程序服务器,重磅!微信PC端支持小程序直接开启 适配Win7及以上系统...
- 【性能测试】轻量级压测工具Hey
- 前端可视化项目全国疫情地图
- 困惑了很久的函数D3DXCreateTextureFromFileInMemoryEx
- 使用 Python +OpenCV+Deepface实现人脸、情感和种族检测
- 「 机器人学 」“Human-aware机器人导航技术”浅谈