<!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. 
						
  2. jQuery插件 -- Form表单插件jquery.form.js<转>
		
    jQuery Form插件是一个优秀的Ajax表单插件,可以非常容易地.无侵入地升级HTML表单以支持Ajax.jQuery Form有两个核心方法 -- ajaxForm() 和 ajaxSubmi ...
    
		
    3. 
						
  3. （转）jQuery插件 -- Form表单插件jquery.form.js
		
    beforeSubmit: validate function validate(formData, jqForm, options) { //在这里对表单进行验证,如果不符合规则,将返回false来 ...
    
		
    4. 
						
  4. jQuery插件 -- Form表单插件jquery.form.js
		
    http://blog.csdn.net/zzq58157383/article/details/7718956 http://my.oschina.net/i33/blog/77250
    
		
    5. 
						
  5. 第一百八十六节，jQuery，验证表单插件，Ajax 表单插件，验证和提交表单
		
    jQuery,验证表单插件,Ajax 表单插件,验证和提交表单 HTML <form id="reg" method="post" action=&quo ...
    
		
    6. 
						
  6. 第一百八十五节，jQuery，Ajax 表单插件
		
    jQuery,Ajax 表单插件 学习要点: 1.核心方法 2.option 参数 3.工具方法 传统的表单提交,需要多次跳转页面,极大的消耗资源也缺乏良好的用户体验.而这款 form.js 表单的  ...
    
		
    7. 
						
  7. Form表单插件
		
    jQuery Form是一个优秀的表单插件,它可以非常容易地,无侵入地升级HTML表单以支持Ajax jQuery Form表单插件的下载地址为 http://jquery.malsup.com/fo ...
    
		
    8. 
						
  8. Form表单利用Jquery Validate验证以及ajax提交
		
    #表单利用Jquery验证验证以及ajax提交 概述>详细讲解表单利用Jquery >验证验证以及ajax提交的过程,以及Validate的自定义提示语,非空判断,输入字段的远程ajax验 ...
    
		
    9. 
						
  9. form 表单 和 jQuery HTML / CSS 方法（$().html 类似的样式）
		
    1 有关链接 :http://www.runoob.com/tags/tag-form.html https://www.cnblogs.com/Jxwz/p/4509618.html https:/ ...
    
		
    10. 
		

	


随机推荐
	

    
									
  1. hdu1520  Anniversary party 简单树形DP
			
    题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1520 思路:树形DP的入门题 定义dp[root][1]表示以root为根节点的子树,且root本身参 ...
    
			
    2. 
						
  2. redis集群安装部署
			
    (要让集群正常工作至少需要3个主节点,在这里我们要创建6个redis节点,其中三个为主节点,三个为从节点,对应的redis节点的ip和端口对应关系如下) 192.168.1.160:7000 192. ...
    
			
    3. 
						
  3. 通过一步步创建sharded cluster来认识mongodb
			
    mongodb是目前使用非常广泛的nosql(not only sql)之一,在db engines上排名非常靠前,下图是5月份的排名: 可以看到前面四个都是传统的关系型数据库,而mongodb在no ...
    
			
    4. 
						
  4. 模板方法模式(Tempalte Method Pattern)
			
    模板方法模式是类的行为模式.准备一个抽象类,将部分逻辑以具体方法以及具体构造函数的形式实现,然后声明一些抽象方法来迫使子类实现剩余的逻辑.不同的子类可以以不同的方式实现这些抽象方法,从而对剩余的逻辑有 ...
    
			
    5. 
						
  5. 浅谈RSA加密
			
    RSA背景 在1976年以前,传统的加解密过程是: 1.A采用某种手段对数据进行加密. 2.数据传输到B的手中. 3.B逆向的实施A加密采用的步骤. 4.数据被还原. 这就是所谓的对称加密. 解密和加 ...
    
			
    6. 
						
  6. 如何优雅地运用 Chrome (Google)
			
    已经在很多工具类文章前言中,提及使用工具的重要性:以至于在写这篇时候,大为窘迫:穷尽了脑海中那些名句箴言,目测都已然在先前文章中被引用.鉴于杳让人心底意识到工具的重要性,并且能践行之,远比介绍如何使用 ...
    
			
    7. 
						
  7. CI 经常失败？可能是这 5 大原因…
			
    本文翻译自文章 Top 5 Reasons for CI Failure,主要介绍了 CI 失败的五个原因,包括 CI 服务的错误选择.CI 工程师的不专业性.随意更改CI服务器配置.CI服务器性能差 ...
    
			
    8. 
						
  8. 011一对一  唯一外键关联映射_单向(one-to-one)
			
    ²  两个对象之间是一对一的关系,如Person-IdCard(人—身份证号) ²  有两种策略可以实现一对一的关联映射 主键关联:即让两个对象具有相同的主键值,以表明它们之间的一一对应的关系:数据库 ...
    
			
    9. 
						
  9. 微信小程序实战（商城）
			
    github地址(欢迎star):https://github.com/xiaobinwu/dj 版本:0.15.152900(暂未升级原因:升级后需要图片无法本地引用,必须使用image或是远程路径 ...
    
			
    10. 
						
  10. Spring+SpringMVC+MyBatis深入学习及搭建(五)——动态sql
			
    转载请注明出处:http://www.cnblogs.com/Joanna-Yan/p/6908763.html 前面有讲到Spring+SpringMVC+MyBatis深入学习及搭建(四)——My ...
    
			
    11.