Explication sur jquery obtenant toutes les instances de valeur et de texte de sélection et d'option-js tutoriel-php.cn

Explication sur jquery obtenant toutes les instances de valeur et de texte de sélection et d'option

小云云

Libérer： 2018-01-23 13:59:21

original

1574 Les gens l'ont consulté

Cet article vous apporte principalement un exemple d'utilisation de jquery pour obtenir toutes les valeurs et textes de select et d'option. L'éditeur le trouve plutôt bon, je vais donc le partager avec vous maintenant et le donner comme référence pour tout le monde. Suivons l'éditeur et jetons un œil. J'espère que cela pourra aider tout le monde.

Pensez-y, j'apprends jQuery depuis quelques jours, et aujourd'hui, en raison de besoins professionnels, je dois obtenir toute la valeur et le texte de l'option sous sélection, puis la coller et l'importer dans un fichier XML. Le résultat Après avoir travaillé dessus tout l'après-midi, j'ai finalement réussi. Voici le code correspondant : Le code dans

a été copié à partir du site Web de quelqu'un d'autre. Je dois maintenant obtenir sa valeur et son texte, puis l'insérer dans

< Chaoyang>7 sous la forme de

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
 <script src="jquery-1.4.2.min.js" type="text/javascript"></script>
 <script type="text/javascript" language="javascript" > 
 $(document).ready(function(){ //等待所有dom绘制完成后就执行
  
     var arr = new Array(); //数组定义标准形式，不要写成Array arr = new Array();
     var all = ""; //定义变量全部保存
     $("#UserBorough option").each(function () {
       var txt = $(this).text(); //获取单个text
       var val = $(this).val(); //获取单个value
       var node = "<" + txt + ">" + val + "</" + txt + ">";
       arr.push(node);
       all += node;
     });
     alert(all);
     alert(arr);

  
 }); //$(document)
 </script>
</head>
<body>

 <select name="UserBorough" size="6" class="input" id="UserBorough" style="width:150px;" onchange="setSmallBorough(&#39;UserBorough&#39;,&#39;SmallBorough&#39;,&#39;/search_auto.aspx?searchtype=Borough&searchkey=&#39;+ this.options[this.selectedIndex].value +&#39;&#39;,&#39;&#39;);">
            <option value=7>朝阳</option><option value=1>海淀</option><option value=4>昌平</option><option value=8>丰台</option><option value=14>大兴</option><option value=2>东城</option><option value=3>西城</option><option value=5>崇文</option><option value=6>宣武</option><option value=12>通州</option><option value=13>顺义</option><option value=11>房山</option><option value=9>石景山</option><option value=10>门头沟</option><option value=15>怀柔</option><option value=18>密云</option><option value=17>延庆</option><option value=16>平谷</option><option value=448>周边</option>
</select>



</body>
</html>

Copier après la connexion

Résumé : La combinaison d'outils peut éviter bien des problèmes, vous pouvez en créer un nouveau VS2010 Tapez le code dans le fichier html, puis copiez le code dans

Dreamweaver pour l'exécuter. Cela vous fera gagner du temps.

Grâce à cet exemple, j'ai réalisé qu'en comprenant simplement les codes du livre et en les tapant, vous ne pourrez peut-être pas écrire quelque chose. Vous devez encore faire un travail plus pratique

et écrivez-le vous-même.

Recommandations associées :

jQuery génère dynamiquement le code d'implémentation de la liste déroulante des options de sélection

jQuery implémente la liste déroulante de sélection pour obtenir le texte actuellement sélectionné

Exemple détaillé de JQuery pour obtenir le contenu textuel de plusieurs options de balises sélectionnées

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!