使用FormData,进行Ajax请求并上传文件；具体代码如下：

html代码：

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <script type="text/javascript" src="./jquery-1.11.0.min.js" ></script>
    <title>测试</title>
</head>
<body>

<button id="uploadAll">上传</button> <br><br>
<form id= "uploadForm">
    <input type="file" name="uploadData" style="display:none"  id="uploadimg" onchange="uploadFile()" /> <br>
    <input type="hidden" name="data-id" style="display:none" id="offerid" value="" /> <br>
</form>

</body>
</html>

js代码：

<script>

    $("#uploadAll").on("click", function(){
        // alert("上传");
        $("#uploadimg").click();
    });
    function uploadFile()
    {
        var formData = new FormData($( "#uploadForm" )[0]);
        $.ajax({
            url: "./uploadAll.php",
            type: 'POST',
            data: formData,
            async: false,
            cache: false,
            contentType: false,
            processData: false,
            success: function (returndata) {
                // alert(returndata); return false;
                if ( returndata=="上传成功!") {
                    alert("上传成功!");return true;
                };
                alert(returndata);return false;
            },
            error: function (returndata) {
                alert(returndata);
            }
        });
    }

</script>

php代码：

<?php

// 获取上传文件的信息
// print_r($_FILES["uploadData"]);die();
if(is_uploaded_file($_FILES['uploadData']['tmp_name'])){
　　$upFile = $_FILES["uploadData"]; // 获取数组里面的值
　　$name = $upFile["name"]; // 上传文件的文件名
　　$type = $upFile["type"]; // 上传文件的类型
　　$size = $upFile["size"]; // 上传文件的大小
　　$tmp_name = $upFile["tmp_name"]; // 上传文件的临时存放路径
　　//判断是否为图片
　　switch ($type){
　　　　case 'image/pjpeg': $okType=true;break;
　　　　case 'image/jpeg': $okType=true;break;
　　　　case 'image/gif': $okType=true;break;
　　　　case 'image/png': $okType=true;break;
　　}

　　if($okType){
　　　　/**
　　 　　* 0:文件上传成功<br/>
　　 　　* 1：超过了文件大小，在php.ini文件中设置<br/>
　　 　　* 2：超过了文件的大小MAX_FILE_SIZE选项指定的值<br/>
　　 　　* 3：文件只有部分被上传<br/>
　　 　　* 4：没有文件被上传<br/>
　　 　　* 5：上传文件大小为0
　　 　　*/
　　　　$error=$upFile["error"];// 上传后系统返回的值
　　　　//把上传的临时文件移动到upload目录下面
　　　　move_uploaded_file( $tmp_name,"./upload/".$name );
　　　　if($error==0){
　　　　　　echo "上传成功!";
　　　　}elseif ($error==1){
　　　　　　echo "超过了文件大小，在php.ini文件中设置";
　　　　}elseif ($error==2){
　　　　　　echo "超过了文件的大小MAX_FILE_SIZE选项指定的值";
　　　　}elseif ($error==3){
　　　　　　echo "文件只有部分被上传";
　　　　}elseif ($error==4){
　　　　　　echo "没有文件被上传";
　　　　}else{
　　　　　　echo "上传文件大小为0";
　　　　}
　　}else{
　　　　echo "请上传jpg,gif,png等格式的图片！";
　　}
}else{
　　echo "您没有上传任何东西!";
}

?>

ajax上传的更多相关文章

  1. IE8/9 JQuery.Ajax 上传文件无效

    IE8/9 JQuery.Ajax 上传文件有两个限制: 使用 JQuery.Ajax 无法上传文件(因为无法使用 FormData,FormData 是 HTML5 的一个特性,IE8/9 不支持) ...

  2. asp.net MVC ajax上传文件

    普通上传 view: <body> <form id="form1" method="post" action="@Url.Acti ...

  3. springMVC+jsp+ajax上传文件

    工作中遇到的小问题,做个笔记 实现springMVC + jsp + ajax 上传文件 HTML <body> <form id="myform" method ...

  4. FormData对象实现文件Ajax上传

    后台: import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; imp ...

  5. 基于HTML5的可预览多图片Ajax上传

    一.关于图片上传什么什么的 在XHTML的时代,我们使用HTML file控件上传图片一次只能上传一张.要一次上传多图,做法是借助于flash.例如swfupload.js.可惜,使用复杂的点,比如f ...

  6. Ajax上传文件进度条显示

    要实现进度条的显示,就要知道两个参数,上传的大小和总文件的大小 html5提供了一个上传过程事件,在上传过程中不断触发,然后用已上传的大 小/总大小,计算上传的百分比,然后用这个百分比控制div框的显 ...

  7. java Springmvc ajax上传

    ajax上传方式相对于普通的form上传方式要便捷,在更多的时候都会使用ajax (简单的小示例) 1.要先去下载一个 jquery.ajaxfileupload.js(基于jquery.js上的js ...

  8. 基于HTML5和JSP实现的图片Ajax上传和预览

    本文对如何实现使用Ajax提交"multipart/form"格式的表单数据,已经如何在图片上传之前,在浏览器上进行预览.使用的主要相关技术HTML5的FILE API,XMLHt ...

  9. 利用jquery+iframe做一个ajax上传效果

    以下是自学it网--中级班上课笔记 网址:www.zixue.it html页面 <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict ...

  10. 伪ajax上传文件

    伪ajax上传文件   最近在折腾伪ajax异步上传文件. 网上搜索了一下,发现大部分方法的input file控件都局限于form中,如果是在form外的呢? 必须动态生成一个临时form和临时if ...

随机推荐

  1. Android 中沉浸式状态栏实现

    Android 中沉浸式状态栏实现方式如下 计算状态栏高度及调用沉浸式状态栏的相关API方法 package com.example.status; import android.annotation ...

  2. 【leetcode】Surrounded Regions（middle）☆

    Given a 2D board containing 'X' and 'O', capture all regions surrounded by 'X'. A region is captured ...

  3. 【资料】Boost的资料

    http://blog.csdn.net/pongba/article/details/1561110

  4. 【Git】笔记2

    来源:廖雪峰 安装git(ubuntu) sudo apt-get install git 创建版本库(repository)  在想生成版本库的文件夹下输入: git init 指定用户名和邮箱 g ...

  5. [Android Pro] Android保存图片到系统图库

    http://stormzhang.github.io/android/2014/07/24/android-save-image-to-gallery/ http://blog.csdn.net/x ...

  6. 靶形数独（codevs 1174）

    1174 靶形数独 2009年NOIP全国联赛提高组  时间限制: 4 s  空间限制: 128000 KB  题目等级 : 钻石 Diamond 题解  查看运行结果     题目描述 Descri ...

  7. 环境搭建及wamp空密码修改

    WAMP:快速搭建PHP环境的.Windows系统下.搭建虚拟的服务器环境.APPSERVER:同上. LAMP架构Linux系统Apache服务器管理软件Mysql数据库Php语言. 修改密码方法: ...

  8. Android之WebView学习

    WebView常用方法 WebSettings 在使用WebView前我们都要进行相关的配置,常见的操作如下: WebSettings settings = mWebView.getSettings( ...

  9. Mac系统下使用VirtualBox虚拟机安装win7－－第一步 安装vbox虚拟机

    Mac系统下使用VirtualBox虚拟机安装win7操作步骤: 第一步 安装vbox虚拟机 1.先下载vbox,下载地址:: https://www.virtualbox.org/wiki/Down ...

  10. self和parent的用法

    总结 self  , parent 的用法               只能用在类的内部 self  本类  (不要理解成本对象) parent 父类 在引入自身的静态属性/静态方法 以及父类的方法时 ...