communauté
Apprendre
Bibliothèque d'outils
Outils d'IA
Loisirs
recherche
Français
Maison > interface Web > js tutoriel > Ajax soumet le formulaire et reçoit la méthode json

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

小云云
Libérer： 2017-12-19 14:09:03
original
1997 Les gens l'ont consulté

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


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

16

<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>

Copier après la connexion

code js


1

2

3

4

5

6

7

8

9

10

11

12

13

14

15

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");

  }

 });

}

Copier après la connexion

code php backend


1

2

3

4

5

6

7

<?php

  $name = $_POST[&#39;xingming&#39;];

  $age = $_POST[&#39;nianling&#39;];

  $myarray = array("name"=>$name, "age"=>$age);

  $myjson = json_encode($myarray);

  echo $myjson;

?>

Copier après la connexion

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!

Étiquettes associées：
ajax javascript json
Article précédent：Exemples pour expliquer l'implémentation Ajax du chargement infini de listes Article suivant：Explication détaillée de la mise en œuvre simple de l'effet de pagination AJAX
Déclaration de ce site Web
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
Derniers articles par auteur
Derniers numéros
Rubriques connexes
Plus>
Recommandations populaires
Tutoriels populaires
Plus>
Tutoriels associés
Recommandations populaires
Derniers cours
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal