异步上传文件

news/2024/7/7 15:13:21 标签: javascript, php

 这里我写的有点重复了 不太简洁 整体可以再优化

 

formData 是DOM对象 不是jquery对象

 

var formData = new FormData($("#file")[0]); 对象.append() 可以追加表单内所有信息上传服务器

 

Jquery的对象是 不能处理file

 

serialize() 序列化表单,用于 Ajax 请求,直接获取表单内数据传送服务器 ,$("form").serialize()

 

 1 $("#file").change(function(e){                      
 2     var animateimg = $(this).val();                 //获取上传的图片名 带//
 3     var imgarr=animateimg.split('\\');                 //分割以逗号                     结果  (C:\fakepath\6.jpg)
 4     var myimg=imgarr[imgarr.length-1];                 //去掉 // 获取图片名                 6.jpg        
 5     var houzui = myimg.lastIndexOf('.');             //获取 . 出现的位置                  1
 6 
 7
 8     var lastName = myimg.substring(houzui).toUpperCase();                         // 也可以    (.JPG) 随便 不转也行,不转 下面也要用小写
 9                               
10     var file = $('#file').get(0).files[0];                 //获取上传的文件
11     var fileSize = file.size;                           //获取上传的文件大小
12     var maxSize = 1048576;                              //最大1MB
13 
14     if(lastName !='.PNG'&& lastName !='.JPG' && lastName !='.JPEG'){
15         parent.layer.msg('文件类型错误,请上传图片类型');
16         return false;
17     }else if(parseInt(fileSize) >= parseInt(maxSize)){
18         parent.layer.msg('上传的文件不能超过1MB');               // 需要layer的js
19         // layer.msg('<p style="color:black">文件上传仅支持 "jpg"和"png"格式</p>', {icon: 5,time: 2000}); 提示框+背景+表情
20         return false;
21     }else{
22         var fileObj = $('#file').get(0).files[0];        23         var formData = new FormData();
24         // 存入文件对象
25         formData.append('file',fileObj);     
26         formData.append('name',$("#name").val());            // 也可以用jquery 获取其他值 追加到后面 一起传过去.  
27         console.log(fileObj);
28 
29         $.ajax({
30             url: "__URL__/setImg",
31             type: 'POST',
32             data: formData,
33             dataType: 'json',
34             async: false,
35             cache: false,
36             contentType: false,
37             processData: false,
38             success: function (response) {
39                 if (response.status == 1) {
40                      alert(response.msg);
41                     window.location.href="<?php echo U('index');?>";
42                 }else if(response.status == 2){
43                     alert(response.msg);
44                 }else {
45                     alert(response.msg);
46                 }
47             },
48         })
49     }
50 });        

php   

setImg方法返回格式:

 echo json_encode(array('status'=>1,'msg'=>"上传成功",'pic'=>$newName)); 

转载于:https://www.cnblogs.com/G921123/p/10167727.html


http://www.niftyadmin.cn/n/1153087.html

相关文章

http各个状态码含义

http各个状态码含义 1**&#xff1a;请求收到&#xff0c;继续处理 2**&#xff1a;操作成功收到&#xff0c;分析、接受 3**&#xff1a;完成此请求必须进一步处理 4**&#xff1a;请求包含一个错误语法或不能完成 5**&#xff1a;服务器执行一个完全有效请求失败100 Continue…

【安卓笔记】高速的发展设置界面-----PreferenceActivity

通常app都会有一个设置界面&#xff0c;例如以下&#xff1a; 通常做法是自定义布局&#xff0c;然后在代码里面加入响应函数&#xff0c;并将结果保存到Sharedpreferences中。android给我们提供了PreferenceActivity来简化开发设置界面。你仅仅需这样做&#xff1a;1.创建一个…

《深入浅出WPF》笔记——绘画与动画

《深入浅出WPF》笔记——绘画与动画 原文:《深入浅出WPF》笔记——绘画与动画本篇将记录一下如何在WPF中绘画和设计动画&#xff0c;这方面一直都不是VS的强项&#xff0c;然而它有一套利器Blend&#xff1b;这方面也不是我的优势&#xff0c;幸好我有博客园&#xff0c;能记录…

汉字编码

很久很久以前&#xff0c;有一群人&#xff0c;他们决定用8个可以开合的晶体管来组合成不同的状态&#xff0c;以表示世界上的万物。他们看到8个开关状态是好的&#xff0c;于是他们把这称为"字节"。再后来&#xff0c;他们又做了一些可以处理这些字节的机器&#xf…

MyBatis 开始-----配置

下载jarmaven:<dependency><groupId>org.mybatis</groupId><artifactId>mybatis</artifactId><version>3.3.0</version> </dependency>gradle:compile("org.mybatis:mybatis:3.3.0")待续。。。转载于:https://blog.…

c语言字符串函数详解

转载自&#xff1a;http://zhanglong2004.spaces.live.com/?owner1void *memset(void *dest, int c, size_t count); 将dest前面count个字符置为字符c. 返回dest的值. void *memmove(void *dest, const void *src, size_t count); 从src复制count字节的字符到dest. 如果…

金牌信通V6无法打开,报错,出现问题,不能使用,更新失败,请求失败等问题处理方式...

2019独角兽企业重金招聘Python工程师标准>>> 第一步&#xff0c;如果打开弹出金牌信通V6加载更新文件失败&#xff0c;请关掉这个页面&#xff08;右下角有一个确定点一下&#xff09; 第二步 关闭金牌信通V6错误页面之后&#xff0c;金牌信通V6主程序还是没有报错正…

TCP建立与断开连接、SOCKET通讯模板

三次握手、四次挥手 传输层中&#xff0c;TCP建立传输链接时的三次握手和关闭链接的四次挥手&#xff0c;因为socket工作于应用层和传输层之间&#xff0c;所以涉及建立链接和关闭链接的过程 TCP使用窗口机制进行流量控制&#xff0c;什么是窗口&#xff1f;连接建立时&#xf…