• ajax请求数据动态填充之文档与字符串区别手法


    success: function(data){
                        if(data.status==200){
                            var realName=data.doc.realName;
                            $("#yishiul").append('<li onclick="quxiaoyish(this,'+2+')"><a href="javascript:void(0);" class=""><label id="docresult" value="'+userId+'">'+ToHtmlString(realName)+'</label><i class="fa fa-times"></i></a></li>');
    
                        }
                    }

    function quxiaoyish(_element,id){
    var _parentElement = _element.parentNode;
    if(_parentElement&&_parentElement.children.length== 1){
    $('.objectRelateCon'+id).css('display','none');
    }
    _parentElement.removeChild(_element);
    }

     
    saveOrgCode = [];
                    success: function(data){
                        if(data.status==200){
                            var realName=data.doc.realName;
                            saveOrgCode.push('<li onclick="quxiaozhuren()"><a href="javascript:void(0);" class="">')
                            saveOrgCode.push('<label id="docLeader" value="')
                            saveOrgCode.push(userId+'">'+ToHtmlString(realName)+'</label><i class="fa fa-times"></i></a></li>');                          
                            $("#zhurenul").html(saveOrgCode.join(""));
                            //$("#docID").val(userId);                    }
                        }
                    }

    //选择第一诊断的ICD编码 - 已选择 - 点击×
    function quxiaozhuren(){
    $('.objectRelateCon').css('display','none');
    $("#zhurenul").html("");
    }

     

    两种都是由ajax成功返回数据并动态填充到ul标签,并想要绑定到每一个li元素点击删除自己的事件,但是,第二种点击li标签删除的是所有的li标签,而第一种删除的只是所点击的li标签,有人可能会说代码就是这样写的,所以会是这种效果,但是根本原因是因为$("#zhurenul").html(saveOrgCode.join(""));这句,每次请求之后都会清空ul标签,重新填充数据,而这个数据用的方法saveOrgCode.join("")含义是把数组里面的数据连接成一个字符串,这样,你就无法将li标签与其他li标签按照dom区分删除,所以,点击删除只能清空ul,而第一种方法也不是完美的,因为每次添加可能会有重复数据,需要后续区分.(进步中,勿喷)

  • 相关阅读:
    深入了解css的行高Line Height属性
    【C++】函数指针
    【C++】常用知识点
    将数字转化为液晶显示屏的样子
    【多媒体】PCM
    【Android】网络下载图片&SD卡文件存储
    CPU 缓存(Cache)
    【C++】typename
    【多媒体】音频格式
    【Android】图片的异步加载
  • 原文地址:https://www.cnblogs.com/macwhirr/p/8078904.html
Copyright © 2020-2023  润新知