HTML代码:

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
</head>
<body>
<div class="upload-btn">
<input type="file" name="file" id="pic" accept="image/gif,image/jpeg,image/x-png"/>
<span></span>
</div>
</body>
</html>
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
</script>
<script>
// /上传图片
//注意这不是click
$('#pic').change(function(event) {
var formData = new FormData();
formData.append("file", $(this).get(0).files[0]);
$.ajax({
url:"http://www.examtest.com/pyg/api/addUpLode",
type:'POST',
dataType:"json",
data: formData,
cache: false,
contentType: false, //不可缺
processData: false, //不可缺
success:function(data){
console.log(data)
if (data.code=500){
alert(data.message)
}
if (data.code==501){
alert(data.message);
}
if (data.code==200){
alert(data.message);
}
}
});
});
</script>

控制器代码:

//单文件上传视图
public function uplode()
{
return view();
} // 接受文件
public function addUpLode()
{
//接受参数:
// $file=request()->file('file');
$file = $this->request->file('file');
//验证参数
if (empty($file)) {
return json(['code' => 500, 'message' => '照片不可以为空', 'data' => $file]);
}
//验证参数
if ($file) {
$info = $file->validate(['size' => 15678, 'ext' => 'jpg,png,gif'])->move(ROOT_PATH . 'public' . DS . 'uploads');
if ($info) {
// 成功上传后 获取上传信息
// 输出 20160820/42a79759f284b767dfcb2a0197904287.jpg
$filename = $info->getSaveName();
/*
* 这里可以进行替换
*
* */
return json(['code' => 200, 'message' => '文件上传成功', 'data' => $file]);
} else {
// 上传失败获取错误信息
return json(['code' => 501, 'message' => $file->getError(), 'data' => $file]);
}
}
}

tp5 ajax单文件上传的更多相关文章

  1. ajax提交表单、ajax实现文件上传

    ajax提交表单.ajax实现文件上传,有需要的朋友可以参考下. 方式一:利用from表单的targer属性 + 隐藏的iframe 达到类似效果, 支持提交含有文件和普通数据的复杂表单 方式二:使用 ...

  2. 表单文件上传,ajax文件上传

    原创链接:http://www.cnblogs.com/yanqin/p/5345562.html html代码  index.jsp(表单文件上传) <form action="sh ...

  3. django项目中form表单和ajax的文件上传功能。

    form表单文件上传 路由 # from表单上传 path('formupload/',apply.formupload,name='formupload/'), 方法 # form表单文件上传 de ...

  4. Ajax(form表单文件上传、请求头之contentType、Ajax传递json数据、Ajax文件上传)

    form表单文件上传 上菜 file_put.html <form action="" method="post" enctype="multi ...

  5. Ajax 与文件上传

    一 Ajax篇 1 ajax简介(Asynchronous Javascript And XML) 异步,Js,XML,即使用Javascript语言与服务器进行异步交互,传输的数据为xml(可扩展标 ...

  6. 基于 Django的Ajax实现 文件上传

    ---------------------------------------------------------------遇到困难的时候,勇敢一点,找同学朋友帮忙,找导师求助. Ajax Ajax ...

  7. ajax与文件上传

    一.ajax ajax(Asynchronous JavaScript And XML):异步JavaScript和XML,即使用JavaScript语句与服务器进行异步交互,传输的数据为XML(也可 ...

  8. python 全栈开发,Day75(Django与Ajax,文件上传,ajax发送json数据,基于Ajax的文件上传,SweetAlert插件)

    昨日内容回顾 基于对象的跨表查询 正向查询:关联属性在A表中,所以A对象找关联B表数据,正向查询 反向查询:关联属性在A表中,所以B对象找A对象,反向查询 一对多: 按字段:xx book ----- ...

  9. python django + js 使用ajax进行文件上传并获取上传进度案例

    <!doctype html> <html lang="en"> <head> <meta charset="UTF-8&quo ...

随机推荐

  1. [SDOI2017]数字表格 & [MtOI2019]幽灵乐团

    P3704 [SDOI2017]数字表格 首先根据题意写出答案的表达式 \[\large\prod_{i=1}^n\prod_{j=1}^mf_{\gcd(i,j)} \] 按常规套路改为枚举 \(d ...

  2. Atcoder ARC-058

    ARC058(2020.7.4) A 从高到低依次填入能填的最小值即可. B 首先可以发现这个区间实际上只有横着的一条边有用,那么我们可以在边界上枚举中转点使得不经过非法区域即可. C 挺神的一道题. ...

  3. AESUtil_1

    package com.tebon.ams.util;import org.apache.commons.codec.binary.Base64;import javax.crypto.Cipher; ...

  4. php7.3编译安装 支持微擎2.0

    再次整理   //一下配置在命令粘贴时注意句尾加 \ , 在 \ 后不能有空格,不然会自动执行,相当于回车./configure --prefix=/usr/local/php \ --with-co ...

  5. Docker 与 K8S学习笔记(二十二)—— 高效使用kubectl的小技巧

    kubectl作为我们主要的操作K8S的工具,其具备非常丰富的功能,但是如果不经过打磨,使用起来还是存在诸多不便,今天我们来看看如何将我们的kubectl打磨的更加易用. 一.命令自动补全 kubec ...

  6. 【论文考古】知识蒸馏 Distilling the Knowledge in a Neural Network

    论文内容 G. Hinton, O. Vinyals, and J. Dean, "Distilling the Knowledge in a Neural Network." 2 ...

  7. verification 验证环境配置传递

    验证环境配置传递 tc配置env 继承关系: tc_base->tc_base_bt->tc_xx base_env->xx_env base_env_cfg->xx_env_ ...

  8. c++ 指针数组与指向数组的指针

    指针数组与指向数组的指针 1.int (*a)[10]-->指向数组的指针 a是一个二级指针,可认为是一个二维数组的首地址,指向一个一维数组,数组存储了10个int数据. int arr1[10 ...

  9. SpringMVC--@RequestMapping注解标注方法解析

    SpringMVC--@RequestMapping注解标注方法解析 本文是基于springboot进行源码追踪分析 问题 @RequestMapping注释的类及方法,Spring是何时,何种方式解 ...

  10. SSM整合时页面出现$ is not defined

    $ is not defined ,有以下几种可能: 1.没有导入jQuery的jar包 2.jQuery的jar包放进了WEB-INF里,jQuery的jar包最好放在WebContent下,跟WE ...