开发者社区> 问答> 正文

jquery 动态追加html,如何操作添加的动态html?

<html>
<head>
  
  <title></title>
    <link rel="stylesheet" type="text/css" href="http://apps.bdimg.com/libs/bootstrap/2.3.2/css/bootstrap.min.css">
    <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
    <script type="text/javascript" src="http://apps.bdimg.com/libs/bootstrap/2.3.2/js/bootstrap.min.js"></script>
</head>
<body>
    <button class="btn btn-large" type="button">Large button</button>
<ol id="ssss">

</ol>



<script type="text/javascript">
    $("button[type='button']").click(function(){
        $("#ssss").append('<li><a href="#">123</a><i class="icon-remove"></i></li>');
    });


    
</script>
</body>
</html>

点击按钮一次添加一个`

123

那么如何点击一下,就可以删除此条的

里的内容?

展开
收起
小旋风柴进 2016-05-30 08:51:26 1989 0
1 条回答
写回答
取消 提交回答
  • <html>
    <head>
        <title></title>
        <link rel="stylesheet" type="text/css" href="http://apps.bdimg.com/libs/bootstrap/2.3.2/css/bootstrap.min.css">
        <script type="text/javascript" src="http://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js"></script>
        <script type="text/javascript" src="http://apps.bdimg.com/libs/bootstrap/2.3.2/js/bootstrap.min.js"></script>
    </head>
    <body>
        <button class="btn btn-large" type="button">Large button</button>
    <ol id="ssss">
    
    </ol>
    
    
    
    <script type="text/javascript">
        $("button[type='button']").click(function(){
            $("#ssss").append('<li><a href="#">123</a><i class="icon-remove"></i></li>');
        });
    
        $('#ssss').on('click', 'i.icon-remove', function(e){
           $(this.parentNode).remove();
        });
    
    
        
    </script>
    </body>
    </html>
    2019-07-17 19:18:56
    赞同 展开评论 打赏
问答排行榜
最热
最新

相关电子书

更多
《零基础HTML入门教程》 立即下载
天猫 HTML5 互动技术实践 立即下载
天猫HTML5互动技术实践 立即下载