Maison > interface Web > js tutoriel > jquery implémente une méthode pour mettre à jour le contenu d'une liste déroulante lorsque triggered_jquery

jquery implémente une méthode pour mettre à jour le contenu d'une liste déroulante lorsque triggered_jquery

WBOY
Libérer: 2016-05-16 15:28:08
original
1592 Les gens l'ont consulté

L'exemple de cet article décrit comment jquery implémente la méthode de mise à jour du contenu d'une liste déroulante lorsqu'elle est déclenchée. Partagez-le avec tout le monde pour votre référence, les détails sont les suivants :

Si le serveur a une adresse de demande pour renvoyer les données requises

url :/bonjour

Renvoie quelque chose comme :

Copier le code Le code est le suivant :
[{"Watermelon":10},{"Apple":12 },{ "Banane":13},{"Mango":14}]

De telles données json

html :

Bouton :

Liste déroulante :

code js :

$(function(){
  $("#btn").click(
   $.ajax({
  type:"POST",
  url:"http://localhost/XXXX/Test",
  cache: false,//不缓存
  dataType:"json",//返回数据格式
  success:function(ret){ 
    $("#sel").empty(); 
    $.each(ret,function(ind){
    for(var key in ret[ind]){
      var opt = $("<option></option>");
     opt.val(ret[ind][key]);
    opt.text(key);
    $("#sel").append(opt);
   }
  });
   }
 });
 );
});

Copier après la connexion

J'espère que cet article sera utile à tous ceux qui programment jQuery.

É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