<!DOCTYPE html>
 <html lang="en">
 <head>
     <meta charset="UTF-8">
     <title>Title</title>
     <script src="jquery.min.js"></script>
     <script src="jquery.form.js"></script>
 </head>
 <body>
 <form id="myForm" action="do.action" method="post">
     姓名: <input type="text" name="name" /> </br>
     性别: <input type="radio" name="sex" value="1">男<input type="radio" name="sex" value="0">女</br>
     邮箱:<input type="text" name="email"></br></br>
     <input type="file" name="files" id="test">
     <input type="submit" value="提交" />
 </form>
     <script type="text/javascript">
 $('#myForm').on("submit",function() {
 //懒人建站整理
     $(this).ajaxSubmit({
             url: 'do.php',                 //默认是form的action
             type: 'post',               //默认是form的method(get or post)
             dataType: "json",           //html(默认), xml, script, json...接受服务端返回的类型
             clearForm: true,          //成功提交后,清除所有表单元素的值
             resetForm: true,          //成功提交后,重置所有表单元素的值
             //target: '#output',          //把服务器返回的内容放入id为output的元素中
             //timeout: 3000,               //限制请求的时间,当请求大于3秒后,跳出请求
             //提交前的回调函数
             beforeSubmit: function(arr,$form,options){
                 //formData: 数组对象,提交表单时,Form插件会以Ajax方式自动提交这些数据,格式如:[{name:user,value:val },{name:pwd,value:pwd}]
                 //jqForm:   jQuery对象,封装了表单的元素
                 //options:  options对象
                 //比如可以再表单提交前进行表单验证
                 console.log("beforeSubmit",arr,$form,options)
             },
             //提交成功后的回调函数
             success: function(data,status,xhr,$form){
                 console.log("success",data,status,xhr,$form);
                 //alert(data.notice_content);
                 if(data.Flag){
                     //console.log(data.Content)
                 }
             },
             error: function(xhr, status, error, $form){
                 //console.log("error",xhr, status, error, $form)
             },
             complete: function(xhr, status, $form){
                 //console.log("complete",xhr, status, $form)
             }
         }
     );
     return false; //阻止表单默认提交
 });
     </script>
 </body>
 </html>
 <?php
 /**
  * Created by PhpStorm.
  * User: hanks
  * Date: 2017/5/18
  * Time: 15:30
  */
 $arr=[];
 if(isset($_FILES['files'])){
     $data_list=$_POST;
     $data=$_FILES['files'];var_dump($data);var_dump($data_list);
 }else{
     $arr=['status'=>0,'notice_content'=>'没有数据!'];
     exit(json_encode($arr,true));
 }

 exit(json_encode($data,true));

 /**
  * array (size=5)
 'name' => string '123456.png' (length=10)
 'type' => string 'image/png' (length=9)
 'tmp_name' => string '/tmp/phpVOxtir' (length=14)
 'error' => int 0
 'size' => int 50140
 /mnt/hgfs/www/test/do.php:11:
 array (size=3)
 'name' => string 'hanks' (length=5)
 'sex' => string '1' (length=1)
 'email' => string 'hanks135******24@gmail.com' (length=26)
  */

 

jquery提交form表单插件jquery.form.js的更多相关文章

  1. Form表单插件jquery.form.js

    常常使用到这个插件,但是老忘记怎么使用,现在对大家写的进行一定的整合. 使用插件实例: 一般的使用方法 <!-- 引入jquery文件 --> <script src="h ...

  2. jQuery插件 -- Form表单插件jquery.form.js<转>

    jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubmi ...

  3. (转)jQuery插件 -- Form表单插件jquery.form.js

    beforeSubmit: validate function validate(formData, jqForm, options) { //在这里对表单进行验证,如果不符合规则,将返回false来 ...

  4. jQuery插件 -- Form表单插件jquery.form.js

    http://blog.csdn.net/zzq58157383/article/details/7718956 http://my.oschina.net/i33/blog/77250

  5. 第一百八十六节,jQuery,验证表单插件,Ajax 表单插件,验证和提交表单

    jQuery,验证表单插件,Ajax 表单插件,验证和提交表单 HTML <form id="reg" method="post" action=&quo ...

  6. 第一百八十五节,jQuery,Ajax 表单插件

    jQuery,Ajax 表单插件 学习要点: 1.核心方法 2.option 参数 3.工具方法 传统的表单提交,需要多次跳转页面,极大的消耗资源也缺乏良好的用户体验.而这款 form.js 表单的 ...

  7. Form表单插件

    jQuery Form是一个优秀的表单插件,它可以非常容易地,无侵入地升级HTML表单以支持Ajax jQuery Form表单插件的下载地址为 http://jquery.malsup.com/fo ...

  8. Form表单利用Jquery Validate验证以及ajax提交

    #表单利用Jquery验证验证以及ajax提交 概述>详细讲解表单利用Jquery >验证验证以及ajax提交的过程,以及Validate的自定义提示语,非空判断,输入字段的远程ajax验 ...

  9. form 表单 和 jQuery HTML / CSS 方法($().html 类似的样式)

    1 有关链接 :http://www.runoob.com/tags/tag-form.html https://www.cnblogs.com/Jxwz/p/4509618.html https:/ ...

随机推荐

  1. R语言结合概率统计的体系分析---数字特征

    现在有一个人,如何对这个人怎么识别这个人?那么就对其存在的特征进行提取,比如,提取其身高,其相貌,其年龄,分析这些特征,从而确定了,这个人就是这个人,我们绝不会认错. 同理,对数据进行分析,也是提取出 ...

  2. hdu2089 不要62 我的第一个数位DP

    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=2089 数位DP的入门题,我是根据kuangbin的博客写出来的 思路: dp[i][0],表示长度为i ...

  3. js函数的使用

                           js函数应用   [函数的声明及调用]: 1.函数声明:    function 函数名(参数1,参数2,·····){    //函数体    retu ...

  4. JVM调优总结:分代垃圾回收详述

    为什么要分代 分代的垃圾回收策略,是基于这样一个事实:不同的对象的生命周期是不一样的.因此,不同生命周期的对象可以采取不同的收集方式,以便提高回收效率. 在Java程序运行的过程中,会产生大量的对象, ...

  5. 头皮发麻的HTML课时一

    话说我都不知道有多少天没有更新我的随笔了,不过我忽的一下发现到灵魂深处的罪孽:好吧,不扯淡了,其实就是自己懒得外加上HTML这个东西又实在是很重要,所以良心发现把我自己所学的给记录下来,我会尽量的写的 ...

  6. zepto全选按钮之全选会根据按钮是否被全部选中更改状态

    在做手机端二次开发购物车的时候,发现zepto全选,没找到,或者功能不是自己想要的 后来做好,分享给需要的人 //全选或多选处理      var CheckAll = $('#items_check ...

  7. Python 基本数据类型_常用功能整理

    一.字符串 字符串 s ="axle" #去两端空格 s.split() #以什么开头 s.startswith("a") #查找子序列,"12&qu ...

  8. RUN vs CMD vs ENTRYPOINT - 每天5分钟玩转 Docker 容器技术(17)

    RUN.CMD 和 ENTRYPOINT 这三个 Dockerfile 指令看上去很类似,很容易混淆.本节将通过实践详细讨论它们的区别. 简单的说: RUN 执行命令并创建新的镜像层,RUN 经常用于 ...

  9. struts2.1.6教程十、类型转换

    建立struts2conversion项目,并搭建好struts2的基本开发环境 1.基于Action的直接属性转换 建立t.jsp页面,内容如下: <s:form action="p ...

  10. 开涛spring3(4.3) - 资源 之 4.3 访问Resource

    4.3.1  ResourceLoader接口 ResourceLoader接口用于返回Resource对象:其实现可以看作是一个生产Resource的工厂类. public interface Re ...