js 点击li动态追加div元素，怎么防止重复追加？？

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title></title>
        <style>
            .kuang{padding-left: 10px; padding-right: 10px; border: 1px solid #FF0000; border-radius: 3px; display: inline-block; height: 20px; line-height:20px ;}
            ul{ padding: 0; margin: 0;}
            .list{height: 25px; line-height: 25px; border-bottom: 1px solid #ececec; list-style: none; width: 300px;}
        </style>
    </head>
    <body>
        <div class="top">
            <!--<div class='kuang'></div>-->
        </div>
        <ul class="bottom">
            <li class="list" disabled="disabled">计算机软件</li>
            <li class="list">计算机硬件</li>
            <li class="list">计算机服务</li>
            <li class="list">通讯</li>
            <li class="list">互联网</li>
        </ul>
        <script src="jquery-1.11.0.js"></script>
        <script>
        var index;
        $(".list").click(function(index){
            var aa = $(this).text();
            index = $(this).index();
            $(".top").append("<div class='kuang' id='"+index+"'>"+aa+"</div>");

        });
        </script>
    </body>
</html>

阅读 9.8k

方案1:

    var index;
    var result=[];
    $(".list").click(function(index){
        var aa = $(this).text();
        index = $(this).index();
        if($.inArray(index,result)==-1) {
            result.push(index);
            $(".top").append("<div class='kuang' id='" + index + "'>" + aa + "</div>");
        }
    });

方案2:

    var index;
    $(".list").click(function(index){
        var aa = $(this).text();
        index = $(this).index();
        if($(".top #"+index).length==0) {
            $(".top").append("<div class='kuang' id='" + index + "'>" + aa + "</div>");
        }
    });

方案3:

    var index;
    $(".list").click(function(index){
        var $ele=$(this);
        var aa = $ele.text();
        index =$ele.index();
        if(!$ele.data('add')) {
            $ele.data('add',true);
            $(".top").append("<div class='kuang' id='" + index + "'>" + aa + "</div>");
        }
    });

js 点击li动态追加div元素，怎么防止重复追加？？

你尚未登录，登录后可以

扁平化数组转换成树形?

省市区街道数据在哪里可以下载？

两个promise问题？

Vue项目一个报错无法找到原因?

如何在JavaScript中从外部中断for循环的执行？

Quartz如何根据cron表达式计算任务开始前发送通知的时间？

前端有没有办法实现页面截图？