Maison > interface Web > js tutoriel > le corps du texte

méthode jquery d'épissage ajax json et chaîne

小云云
Libérer: 2018-10-31 09:58:35
avant
3280 Les gens l'ont consulté

Organisez les documents et recherchez un code d'épissage jquery ajax et d'épissage de chaînes Cet article présente principalement la méthode d'épissage jquery ajax et d'épissage de chaînes. Voici un code détaillé. Les amis qui en ont besoin peuvent le faire pour référence.

jQuery concatène la chaîne ajax

<form id="myForm" action="#">
  <input name="name"/>
  <input name="age"/>
  <input type="submit"/>
</form>
<script src="http://cdn.static.runoob.com/libs/jquery/1.10.2/jquery.min.js"></script>
<script>
  (function($){
    $.fn.serializeJson=function(){
      var serializeObj={};
      $(this.serializeArray()).each(function(){
        serializeObj[this.name]=this.value;
      });
      return serializeObj;
    };

    $(&#39;#myForm&#39;).bind(&#39;submit&#39;,function(e){
      console.log($(this).serializeJson())
    })
  })(jQuery)

</script>
Copier après la connexion

ou la sérialise directement en utilisant $("#formid").serialize(). . .

Le plug-in ci-dessus ne peut pas être appliqué aux contrôles d'entrée avec plusieurs valeurs, tels que les cases à cocher et les sélections multiples. Ensuite, je modifierai davantage le plug-in pour prendre en charge plusieurs sélections. Le code est le suivant :

Code Js

(function($){
  $.fn.serializeJson=function(){
    var serializeObj={};
    var array=this.serializeArray();
    var str=this.serialize();
    $(array).each(function(){
      if(serializeObj[this.name]){
        if($.isArray(serializeObj[this.name])){
          serializeObj[this.name].push(this.value);
        }else{
          serializeObj[this.name]=[serializeObj[this.name],this.value];
        }
      }else{
        serializeObj[this.name]=this.value;
      }
    });
    return serializeObj;
  };
})(jQuery);
Copier après la connexion

Ici, j'encapsule la valeur multi-sélectionnée dans une valeur numérique pour le traitement. Si vous devez encapsuler la valeur de sélection multiple dans une chaîne reliée par "," ou d'autres formes lors de son utilisation, veuillez modifier vous-même le code correspondant.

Le test est le suivant :

Formulaire :

Code HTML

<form id=”myForm” action=”#”>
      <input name=”name”/>
      <input name=”age”/>
      <select multiple=”multiple” name=”interest” size=”2″>
      <option value =”interest1″>interest1</option>
      <option value =”interest2″>interest2</option>
      <option value=”interest3″>interest3</option>
      <option value=”interest4″>interest4</option>
      </select>
      <input type=”checkbox” name=”vehicle” value=”Bike” /> I have a bike
      <input type=”checkbox” name=”vehicle” value=”Car” /> I have a car
      <input type=”submit”/>
      </form>
Copier après la connexion

Résultat du test :

{âge : " aa", intérêt : ["interest2", "interest4"],nom : "dd",véhicule :["Bike","Car"]}

<form id="myForm" action="#">
  <input name="name" value="111"/>
  <input name="age" value="2222"/>
  <button type="submit">tijiao</button>
</form>
</body>

<script src="../js/jquery-1.11.0.min.js"></script>
<script>
  var dataId = $("#myForm input").map(function (){
    // return($(this).attr("id"));
    return($(this).attr("name")+&#39;=&#39;+$(this).val());
  }).get().join("&");
  alert(dataId);
  </script>
Copier après la connexion

Recommandations associées :

Explication détaillée de l'épissage des chaînes dans la syntaxe vue

Comment utiliser ajax pour épisser dynamiquement le code HTML

Comment implémenter des variables et épissage de chaînes dans vue

Source de cet article : https://blog.csdn.net/lunhui1994_/article/details/54911845


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:
source:csdn.net
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
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!