上传input中file文件到云端,并返回链接
有的文件、图片等信息可以上传到云端上,然后使用链接调用,这样会更加的方便和快捷。
<form id="form">
<input type="file" id="input">
<input type="text" id="text">
</form>
<button id="button">上传</button>
<script src="https://code.jquery.com/jquery-3.1.1.min.js"></script>
<script type="text/javascript">
$("#button").click(function () {
if (window.FormData){
var FormData = new FormData();
FormData.append("file",document.getElementById("input").files[0]);
var XMLHttpRequest = new XMLHttpRequest();
XMLHttpRequest.open("POST","此处为上传的接口");
XMLHttpRequest.onload = function () {
if (XMLHttpRequest.status === 200){
var response = JSON.parse(XMLHttpRequest.response);
$("#text").val(response.data);
} else {
alert("Failure");
}
};
XMLHttpRequest.send(FormData);
}
else {
alert("莫名错误");
}
});
</script>
上传input中file文件到云端,并返回链接的更多相关文章
- Ajax 上传input type file 文件
Html: <div class="attach-img"> <label><input type="file" id=" ...
- 文件上传input type="file"样式美化
<!DOCTYPE html> <html> <head> <meta http-equiv="Content-Type" content ...
- js 压缩上传的图片方法(默认上传的是file文件)
//压缩图片方法 function compressImg(file,callback){ var src; var fileSize = parseFloat(parseInt(file['size ...
- HTML-js 压缩上传的图片方法(默认上传的是file文件)
//压缩图片方法 function compressImg(file,callback){ var src; var fileSize = parseFloat(parseInt(file['size ...
- Plupload上传插件中文文档
Plupload上传插件中文帮助文档 如有疑问,加群交流:646104701 下载地址:https://www.plupload.com/download/ 配置参数 实例化一个plupload对象时 ...
- php 文件上传$_FILES中error返回值详解
用PHP上传文件时,我们会用程序去监听浏览器发送过来的文件信息,首先会通 过$_FILES[fieldName]['error']的不同数值来判断此欲上传的文件状态是否正常.$_FILES[field ...
- input上传指定类型的文件
1. 谷歌–上传文件夹 添加属性webkitdirectory <input type = "file" webkitdirectory> 2. 上传文件–限制类型 添 ...
- [PHP学习教程 - 文件]002.修改上传文件大小限制(File Upload Limit)
引言:通常大家直装xampp之后,默认的文件上传大小应该被设定成2M左右,这个时候如果上传超过2M的东西,就会报错,让人非常尴尬.如何修改呢? 导航索引: 概念 FTP常用API FTP封装类 其他 ...
- 基于SqlSugar的开发框架循序渐进介绍(7)-- 在文件上传模块中采用选项模式【Options】处理常规上传和FTP文件上传
在基于SqlSugar的开发框架的服务层中处理文件上传的时候,我们一般有两种处理方式,一种是常规的把文件存储在本地文件系统中,一种是通过FTP方式存储到指定的FTP服务器上.这种处理应该由程序进行配置 ...
随机推荐
- css3属性box-sizing:border-box 用法解析
响应式Web设计经常需要我们通过百分比设置组件宽度.如果我们不考虑边框,那么很容易就可以实现,但如果你给每一列以及总宽度都采用百分比设置,那这个时候固定的边框大小就会出来捣乱.下面我们将看到一组方法去 ...
- 205. jetcache:你需要知道的小技巧
[视频&交流平台] àSpringBoot视频:http://t.cn/R3QepWG à SpringCloud视频:http://t.cn/R3QeRZc à Spring Boot源码: ...
- Dubbo源码解析之registry注册中心
阅读须知 dubbo版本:2.6.0 spring版本:4.3.8 文章中使用/* */注释的方法会做深入分析 正文注册中心是Dubbo的重要组成部分,主要用于服务的注册与发现,我们可以选择Redis ...
- svg转png
svg转png网络上常用的方式有两种: 1.直接转base64放到图片src进行显示,测试效果不佳,始终报方法问题. 2.先转canvas,再转为png图,测试效果可以但svg透明背景到了canvas ...
- yum梳理
- Openface 入门
Openface 简单入门 背景 Openface是一个开源的人脸识别框架,同类软件产品还有 seetaface ,DeepID等,当然,如果算上商业的产品,那就更多了. Openface人脸比对结果 ...
- Elasticsearch 整合spring(不是sprig boot)
公司做统计任务,有使用Es做聚合操作,使用的是自己封装的版本,这边整合下原生spring,做下学习记录,随便看一下,发现差不多都是spring boot的案例...我该怎么办,...发现整合的过程其实 ...
- firewalld 操作
https://blog.csdn.net/s_p_j/article/details/80979450 firewall-cmd --permanent --add-rich-rule=" ...
- 4、python常用基础类型介绍
1.字符串 str 描述性质的一种表示状态的例如名字 word='helloworld' print(type(word),word) <class 'str'> helloworld2. ...
- JS 高级总结
一.查找HTML元素 通常,通过 JavaScript,您需要操作 HTML 元素. 1.通过 id 找到 HTML 元素 2.通过标签名找到 HTML 元素 3.通过类名找到 HTML 元素 提示: ...