<!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. C语言模拟实现多态

    一.多态的主要特点 1.继承体系下.继承:是面向对象最显著的一个特性.继承是从已有的类中派生出新的类,新的类能吸收已有类的数据属性 和行为,并能扩展新的能力,已有类被称为父类/基类,新增加的类被称作子 ...

  2. 封装GCD以及介绍如何使用

    研究GCD有一段时间,翻译了多篇文章,找了很多的资料,看了很多官方文档,看起来很难,实际上很简单,本人一一进行讲解怎么使用. 支持ARC以及非ARC,无论在ARC环境还是在非ARC环境,都需要调用di ...

  3. php的文件引用

    最近研究公司代码时发现了set_include_path(dirname(__FILE__));这样一行代码,在网上查了些资料,才把这个方法的作用弄清楚. 首先,dirname(__FILE__)这个 ...

  4. OAuth及第三方登录

    现在的生活中运用互联网的有好多地方,我们既要申请微博,申请博客,申请邮箱等等:哪怕登录一个小网址看点东西都要注册登录,不过现在好多了:有了第三方登录,再也不用担心这不够用的脑子整天记忆账号和密码了,只 ...

  5. StringTokenizer使用笔记

    StringTokenizer 基本使用 笔者最近在做算数表达式的逆波兰式转换和解析,原始表达式为String类型,在使用StringTokenizer 之前笔者的解决思路是 将原始表达式->转 ...

  6. 使用NetronGraphLib类库开发Qfd质量屋编制工具

    前言 可执行文件下载 QfdHouse-exe.zip 因项目需要做了一个质量功能配置(Quality Function Deployment 简称Qfd)的质量屋编制工具软件,本软件是在发布一个免费 ...

  7. .Net程序员学用Oracle系列(30):零碎补充、最后总结(The End)

    1.同义词 2.Flashback 技术 3.连接字符串的写法 4.转义字符 & 特殊运算符 5.文件类型 6.查看参数 & 修改参数 7.AWR 工具 8.学习方法 & 学习 ...

  8. 决策树模型比较:C4.5,CART,CHAID,QUEST

    (1)C4.5算法的特点为: 输入变量(自变量):为分类型变量或连续型变量. 输出变量(目标变量):为分类型变量. 连续变量处理:N等分离散化. 树分枝类型:多分枝. 分裂指标:信息增益比率gain ...

  9. input输入框控制字数

    HTML: <input class = "remark" type = "text" maxlength = "500"> J ...

  10. Maven基本安装与配置

    百度Maven,进入Maven官网,点击Download 点击下载Binary zip包,下载到电脑上相应的位置即可. 找到下载文件,进行解压,解压到相应的文件夹下面,并且记住路径. 打开系统-> ...