js jq 图片上传功能

<input type="file" onchange="uploadHandler(this)"><img src="" alt="" id="pic">
function uploadHandler(e) {console.log(e.files[0])// 先获取到选择文件var file = e.files[0]// 创建一个FormData对象var formData = new FormData();// 把选择的文件设置到formData中formData.set('file', file)$.ajax({method: 'POST',url: 'http://localhost:3000/file_upload',data: formData,processData: false,contentType: false,success: function (data) {console.log(data);$('#pic').attr('src', 'http://localhost:3000/update/' + data.data.file_url)}})}

js jq 图片上传功能相关推荐

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

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

  2. js实现图片上传功能,后台为Java

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

  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. 关于微信内置浏览器,打开图片上传功能,调用的问题

    关于微信内置浏览器,打开图片上传功能,调用的问题 前段时间,项目完结测试的时候,同事打开魅族手机测试,无意中发现一个奇葩的问题! 描述: 显示的是文件系统,列表式的,没有调用相机的功能图标,为什么呢? ...

最新文章

  1. SQLServer2008/2005 生成数据字典语句
  2. github搭建个人博客 hexo d无效
  3. redis 槽点重新分配 集群_redis集群高可用部署-cluster-槽点的迁移查看
  4. 关于w3wp.exe
  5. mysql bitmap index_[MySQL] mysql中bitmap的简单运用
  6. Windows 10 IIS所有的html返回空白
  7. 【UML】协作图Collaboration diagram(交互图)(转)
  8. LibreOffice、OpenOffice 漏洞可导致黑客欺骗已签名文档
  9. 魅族android面试题,【魅族小米IT面试题】面试问题:Android… - 看准网
  10. Code UI Automation脱离VS黑盒自动化测试工具编写
  11. 全球及中国晶圆锯划片刀行业发展态势及投资潜力预测报告2021-2027年
  12. 纯JavaScript实现鼠标拖尾效果
  13. 100道MySQL面试题及答案
  14. 将Map转换成List
  15. 常见笔顺错误的字_有哪些常见笔顺错误?
  16. Unity Shader Alpha测试
  17. 关于printf(%d,%d,i--,i++)的问题
  18. 有哪些简洁的人生建议?
  19. 在配置SSH免密登录时报错:/usr/bin/ssh-copy-id: ERROR: failed to open ID file '/root/.pub': 没有那个文件或目录
  20. 本机磁盘序列号和MAC地址查询方法

热门文章

  1. ThingsBoard资产设备总数/离线数/在线数统计
  2. 海信研发前端工程师面试经验总结
  3. 留个念想,clipper库的使用效果
  4. 2019年9月25日
  5. 华为重磅发布芯片,领衔开启2019 CES,一文看尽五大硬核亮点...
  6. python中使用ffmpeg进行视频指定时长截断(解决剪切后音视频不同步的问题)
  7. 进程概念——PCB详讲
  8. 0914LeNet/AlexNet/VGG/NiN网络
  9. python爬虫——爬取淘票票正在热映电影
  10. 利用百度地图采集大量某一区域经纬度信息