Maison > interface Web > js tutoriel > JS obtient plusieurs éléments de données dans un champ de formulaire et les convertit au format json. Exemple de partage.

JS obtient plusieurs éléments de données dans un champ de formulaire et les convertit au format json. Exemple de partage.

小云云
Libérer: 2018-01-15 10:32:43
original
2250 Les gens l'ont consulté

Cet article présente principalement les informations pertinentes sur l'obtention par JS de plusieurs données dans un champ de formulaire et leur conversion au format json. Les amis qui en ont besoin peuvent s'y référer. J'espère que cela pourra aider tout le monde.

Comme le montre la figure, vous devez obtenir les données dans les deux balises li ci-dessous, puis les transmettre à l'arrière-plan et le format de données reçu par l'arrière-plan est ; json, vous devez donc le mettre dans les deux balises li. Les informations sont converties au format suivant.


{recieverName:小红,recieverPhone:12341234,recieverAddress:中国湖南},{recieverName:小明,recieverPhone:12345678,recieverAddress:中国上海}
Copier après la connexion

Le code est le suivant :


var recieverArr = []; //全局变量
var recieverMsg = {}; //全局变量
function recieverMsgToJson(parentFormId){  //若有多个表单公用这个函数,这里需要传所属表单的ID;例如新增和修改。
 $(parentFormId + ".recieverList li").each(function(m){  //遍历每个li,当前有两个li
   var recieverAttributes = [];
   $(this).find("span").each(function(n){  //遍历每个li下的span,而每个li下有三个span
     recieverAttributes[n] = $(this).children("input").val();  //找到每个span下存放着数据的input框,并获取值存放到数组中
   });
   var recieverObj = {  //用对象来表示数据;这时对象是{recieverName:小明,recieverPhone:12345678,recieverAddress:中国上海}
     receiverName:recieverAttributes[0],
     receiverPhone:recieverAttributes[1],
     receiverAddress:recieverAttributes[2]
   };
   recieverArr.push(recieverObj);    
 });
}
recieverMsg = JSON.stringify(recieverArr).replace(/\[|]/g, '') //将数组转化为json格式
console.log(recieverMsg)
//{recieverName:小红,recieverPhone:12341234,recieverAddress:中国湖南},{recieverName:小明,recieverPhone:12345678,recieverAddress:中国上海}
 $.ajax({
  url: '',
  type: 'post',
  data: {
   receiverInfo:recieverMsg,//收件人信息
  },
  traditional:true,
  success: function(data){
   console.log(data);
  },
  error: function() {
   alert("新增订单失败")
  }
 })
Copier après la connexion

Recommandations associées :

Exemple de code de soumission Ajax au format json

Explication détaillée du contrôle du format json en php

java convertit les documents XML en données au format json

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:php.cn
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