Utiliser JQuery pour implémenter des fonctions asynchrones de soumission de formulaires et de téléchargement de fichiers-js tutoriel-php.cn

L'exemple de cet article décrit les fonctions de soumission de formulaire asynchrone et de téléchargement de fichiers JQuery. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Jquery.form.js est un plug-in qui peut soumettre des formulaires et télécharger des fichiers de manière asynchrone.

Les exemples sont les suivants :

index.html

<!DOCTYPE html>
<html>
<head> 
  <title></title> 
  <meta charset="utf-8" /> 
  <script type="text/javascript" language="javascript" src="js/jquery-1.10.2.js"></script> 
  <script type="text/javascript" language="javascript" src="js/jquery.form.js"></script> 
  < script type = "text/javascript"language = "javascript" > 
  $(function() { //异步提交表单    
    $("#ajaxSubmit").on("click",function(){      
      console.log($(this));      
        $("#formToUpdate").ajaxSubmit({     
             type:&#39;post&#39;,          
             url:&#39;p.php&#39;,          
             success:function(data){            
             console.log(data);          },          
             error:function(XmlHttpRequest,textStatus,errorThrown){          
               console.log(XmlHttpRequest);            
               console.log(textStatus);            
               console.log(errorThrown);     
                    }    
                   });   
                      }); 
                         });  
                         </script>
  </head>
 <body>
  <form id="formToUpdate" method="post" action="#" enctype="multipart/form-data"> 
   <input type="text" name="t1" />
   <br /> 
   <input type="file" name="f1" />
   <br /> 
   <input id="ajaxSubmit" type="button" value="异步提交" />
  </form> 
 </body>
</html>

p.php

<? php
/** * Created by JetBrains PhpStorm. * User: smeoi * To change this template use File | Settings | File Templates. */
echo &#39;<pre class="brush:php;toolbar:false">&#39;;
print_r($_POST);
echo &#39;

'; echo '

&#39;;
print_r($_FILES);
echo &#39;

Rendu :

UaHHTML5 Chinese Learning Network-HTML5 Pioneer Learning Network

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Utiliser JQuery pour implémenter des fonctions asynchrones de soumission de formulaires et de téléchargement de fichiers

Articles Liés