闲话不多说上代码 前端代码

<!DOCTYPE HTML>

<html lang="zh-CN">

<head>

    <meta charset="UTF-8">

    <title>ajax表单处理</title>

</head>

<body>

    <form class="upForm" action="http://localhost/dynamicPHP/Home/Index/getFile" method="post" enctype="multipart/form-data">

        <table>

            <tr>

                <td>用户名：</td>

                <td><input type="text" name="name" /></td>

            </tr>

            <tr>

                <td>密码：</td>

                <td><input type="password" name="pwd" /></td>

            </tr>

            <tr>

                <td>性别：</td>

                <td>

                    <input type="radio" name="sex" value="0" checked />男

                    <input type="radio" name="sex" value="0" />女

                </td>

            </tr>

            <tr>

                <td>图像：</td>

                <td><input type="file" name="upfile" /></td>

            </tr>

            <tr>

                <td></td>

                <td><input type="button" value="提交" /></td>

            </tr>

        </table>

    </form>

</body>

<script type="text/javascript" src="js/jquery-2.0.3.min.js"></script>

<script type="text/javascript" src="js/jquery.form.js"></script>

<script type="text/javascript">

    $(function() {

        $(".upForm input[type='button']").on("click", function() {

            var options = {

                "beforeSubmit" : checkForm,

                "success" : resultForm,

                "resetForm" : true,

                "dataType" : "json"

            };

            $(".upForm").ajaxSubmit(options);

        });

        function checkForm(formData, form, options) {

            //表单提交前处理

            console.log("提交前")

        }

        function resultForm(data, status) {

            //表单完成

            console.log(data);

        }

    });

</script>

</html>

　后端php代码

public function getFile(){

        $upload = new Upload($_FILES);// 实例化上传类

        $upload->maxSize   =     10485760 ;// 设置附件上传大小 字节为单位1M=1024*1024

        $upload->exts      =     array('jpg', 'gif', 'png', 'jpeg','mp4');// 设置附件上传类型

        $upload->rootPath  =     './'; // 设置附件上传根目录

        $upload->savePath  =     'Public/Uploads/'; // 设置附件上传（子）目录

        // 上传文件

        $info = $upload->upload($_FILES);

        if($info['size']>=10485760){

            echo "<script>alert('请上传10M以内的视频或图片')</script>";

        }else{

            if(!$info) {// 上传错误提示错误信息

                $this->error($upload->getError());

            }else{// 上传成功 获取上传文件信息

                $data[ 'name' ] = $_POST[ 'name' ];

                $data[ 'pwd' ] = $_POST[ 'pwd' ];

                $data[ 'sex' ] = $_POST[ 'sex' ];

                $data['img_name']= $info['upfile']['savename'];

                $data['img_path']= $info['upfile']['savepath'];

                $data["state"]=1;

                $res=M("pic")->add($data);

                if($res){

                    $this->ajaxReturn([stateCode=>"200",msg=>"上传成功"]);

                }

            }

        }

    }

　　

jquery-from+php 文件上传的更多相关文章

  1. 转: 如何实现jQuery的Ajax文件上传

    [PHP文件上传] 在开始之前,我觉得是有必要把通WEB上传文件的原理简单说一下的.实际上,在这里不管是PHP,JSP,还是ASP处理上传的文件,其实都是WEB早已把文件上传到服务器了,我们只是运用上 ...

  2. jQuery插件AjaxFileUpload文件上传实现Javascript多文件上传功能

     Ajax file upload plugin是一个功能强大的文件上传jQuery插件,可自定义链接.或其它元素庖代传统的file表单上传结果,可实现Ajax动态提示文件上传 过程,同时支撑多文 ...

  3. jquery组件WebUploader文件上传用法详解

    这篇文章主要为大家详细介绍了jquery组件WebUploader文件上传用法,具有一定的参考价值,感兴趣的小伙伴们可以参考一下 WebUploader是由Baidu WebFE(FEX)团队开发的一 ...

  4. Javascript Fromdata 与jQuery 实现Ajax文件上传以及文件的删除

    前端HTML代码: <!DOCTYPE html> <html> <head> <title>ajax</title> <script ...

  5. Javascript Fromdata 与jQuery 实现Ajax文件上传

    <!DOCTYPE html> <html> <head> <title>ajax</title> <script type=&quo ...

  6. js 使用jquery.form.js文件上传

    1.文件上传,使用jquery.form.js插件库 <!DOCTYPE html> <html> <head> <meta charset="UT ...

  7. jquery+springMVC实现文件上传

    此文章是基于 搭建Jquery+SpringMVC+Spring+Hibernate+MySQL平台 一. jar包介绍 1. commons-fileupload-1.3.1.jar 二. 相关程序 ...

  8. jQuery File Upload 文件上传插件使用一 (最小安装 基本版)

    jQuery File Upload 是一款非常强大的文件上传处理插件,支持多文件上传,拖拽上传,进度条,文件验证及图片音视频预览,跨域上传等等. 可以说你能想到的功能它都有.你没想到的功能它也有.. ...

  9. jQuery File Upload文件上传插件简单使用

    前言 开发过程中有时候需要用户在前段上传图片信息,我们通常可以使用form标签设置enctype=”multipart/form-data” 属性上传图片,当我们点击submit按钮的时候,图片信息就 ...

  10. Jquery Uploadify多文件上传实例

    jQuery Uploadify开发使用的语言是java. 详细的相关文档,可以参考官网的doc:http://www.uploadify.com/documentation/ 官网的讲解还是很详细的 ...

随机推荐

  1. 第14.16节 爬虫实战2：赠人玫瑰，手留余香！ request+BeautifulSoup实现csdn博文自动点赞

    写在前面:本文仅供参考学习,请勿用作它途,禁止转载! 在<第14.14节 爬虫实战准备:csdn博文点赞过程http请求和响应信息分析>老猿分析了csdn博文点赞处理的http请求和响应报 ...

  2. 第14.13节 BeautifulSoup的其他功能导览

    前面<第14.9节 Python中使用urllib.request+BeautifulSoup获取url访问的基本信息 >.<第14.10节 Python中使用BeautifulSo ...

  3. 第 7 篇 Scrum 冲刺博客

    每天举行会议 会议照片: 昨天已完成的工作与今天计划完成的工作及工作中遇到的困难: 成员姓名 昨天完成工作 今天计划完成的工作 工作中遇到的困难 蔡双浩 补充注释,初步查找bug 修改bug 无 陈创 ...

  4. AcWing 330. 估算

    大型补档计划 题目链接 若 \(K = 1\),显然,\(B[i]\) 取 \(A\) 序列的中位数时最优. 考虑扩展,我们只需要把 \(A\) 分成 \(K\) 段,每段内, \(B\) 最优的取值 ...

  5. 微信小程序日期转换、比较、加减

    直接上干货: 在utils目录下新建一个dateUtil.js,代码如下:(在需要用的地方引入这个js,调用相关方法传入对应参数就可以使用了) 该工具脚本,实用性很高,通用于各类前端项目,熟悉后亦可以 ...

  6. 一、什么是Jmeter？Jmeter安装？Jmeter的启动？

    什么是Jmeter Apache JMeter 是 Apache 组织开发的基于 Java 的压力测试工具,也可以进行接口测试.它是一个开源的,100%基于Java的应用程序,带有图形界面.它旨在分析 ...

  7. SSO的通用标准OpenID Connect

    目录 简介 OpenID Connect是什么 ID Token 请求ID Token ID Token可以做什么 Open Connect认证码授权的例子 User Info 简介 OpenID C ...

  8. PB级大规模Elasticsearch集群运维与调优实践【＞＞戳文章免费体验Elasticsearch服务30天】

    [活动]Elasticsearch Service免费体验馆>> Elasticsearch Service自建迁移特惠政策>>Elasticsearch Service新用户 ...

  9. Python自动化测试入门必读（最新）

    入门自动化测试必读 自动化测试概念 自动化测试是把以人为驱动的测试行为转化为机器执行的一种过程.通常,在设计了测试用例并通过评审之后,由测试人员根据测试用例中描述的规程一步步执行测试,得到实际结果与期 ...

  10. 工具-Redis-介绍（99.6.1）

    @ 目录 1.nosql介绍 2.Redis特性 3.redis应用场景 关于作者 1.nosql介绍 not only sql,不支持SQL语法.存储结构跟传统关系型数据库中的那种关系表完全不同,n ...