Maison > interface Web > js tutoriel > Résumé des compétences ul de l'opération jquery

Résumé des compétences ul de l'opération jquery

巴扎黑
Libérer: 2017-09-01 11:22:47
original
1692 Les gens l'ont consulté

L'éditeur suivant vous apportera quelques notes d'opération pour l'opération jquery ul (informations sèches). 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

1. Balises HTML


 <ul id="attachText">
     <li data-text="111"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >查看附件</a>  <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >删除</a></li>
     <li data-text="222"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >查看附件</a>  <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >删除</a></li>
     <li data-text="333"><a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >查看附件</a>  <a href="#" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" rel="external nofollow" >删除</a></li>
 </ul>
Copier après la connexion

JS

1. Obtenez la valeur du texte de données de l'attribut li, séparé par


function GetValues()
  {
   var values = "";
   var obj = $("#attachText li");   
   if(obj.length>0)
   {
    var len = $(obj).length-1;
    $.each(obj, function (index, value)
    {
     //表示为最后一个元素
     if (index == len) {
      values += $(value).attr("data-text");
     }
     else {
      values += $(value).attr("data-text") + ",";
     }
    })
   }
   console.log(values);
  }
Copier après la connexion

Résultat de sortie ; 111 222 333

2. Initialisez l'élément li de ul lors de l'édition


function LoadAttach()
  {
   $("#attachText").html("");//先清空
   
   var data="111,222,333";
   var arr = data.split(&#39;,&#39;);
   $.each(arr, function (index, value) {  
     $("#attachText").prepend("<li data-value=\"" + $.parseJSON(data).data + "\"><a>查看附件</a>  <a>删除</a></li>");     
   });
  }
Copier après la connexion

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