JQuery操作ul的一些操作笔记

1、HTML标记

<ul id="attachText">
       <li data-text="111"><a href="#">查看附件</a>&nbsp;&nbsp;<a href="#">删除</a></li>
       <li data-text="222"><a href="#">查看附件</a>&nbsp;&nbsp;</a></li>
        <li data-text="333"><a href="#">查看附件</a>&nbsp;&nbsp;<a href="#">删除</a></li>
</ul>

JS

1、获取li属性data-text的值用,隔开

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);
}

输出结果:111,222,333

2、编辑的时候初始化ul的li项

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

 

posted @ 2017-08-30 16:11  维尼熊320  阅读(357)  评论(0编辑  收藏  举报