Maison > Article > interface Web > Ajax soumet le formulaire et reçoit la méthode json

Ajax soumet le formulaire et reçoit la méthode json

小云云original: 2017-12-19 14:09:031874parcourir

Après avoir cliqué sur le bouton, les données sont soumises au serveur sous la forme d'un formulaire et les données de retour du serveur sont reçues. La page ne s'actualise pas pendant le processus. Cet article présente principalement l'exemple de code d'Ajax soumettant un formulaire et recevant json. C'est très bien et a une valeur de référence. Les amis dans le besoin peuvent s'y référer.

code html

<html xmlns="http://www.w3.org/1999/xhtml">
 <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
 <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
 <script src="./testajaxjs.js"></script>
 <head>
 </head>
 <body>
  <form id="form1">
   <p>xingming:<input type="text" name="xingming"/></p>
   <p>nianling:<input type="text" name="nianling"/></p>
  </form>
  <button type="button" id="mybt" onclick="mysubmmit()">
   ajax提交
  </button>
 </body>
</html>

code js

function mysubmmit(){
 $.ajax({
  type: "POST",
  url: "testajaxend.php",
  data: $(&#39;#form1&#39;).serialize(),
  async: false,
  success: function(databack){
   //console.log("chenggong");
   console.log(databack);
  },
  error: function(request){
   console.log("shibaile");
  }
 });
}

code php backend

<?php
  $name = $_POST[&#39;xingming&#39;];
  $age = $_POST[&#39;nianling&#39;];
  $myarray = array("name"=>$name, "age"=>$age);
  $myjson = json_encode($myarray);
  echo $myjson;
?>

Recommandations associées :

Deux méthodes de jquery implémentant le formulaire de soumission ajax

Ajax technologie formulaire de soumission ajax jquery ajax tutoriel js ajax

php HTML formulaire de soumission sans actualisation formulaire de soumission formulaire de soumission ajax formulaire de soumission js formulaire de soumission

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!

Déclaration：

Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn

Article précédent：Exemples pour expliquer l'implémentation Ajax du chargement infini de listesArticle suivant：Exemples pour expliquer l'implémentation Ajax du chargement infini de listes

Articles Liés

Voir plus