DefinaHelper 2016-06-24 17:13 采纳率: 100%
浏览 4211
已采纳

javascript如何替换html内容，而不影响事件

 <div> 用户名：${Name}  <a href="#">处理方式</a></div>

例如上面的代码，a标签上绑定了点击事件，我想用js把 ${Name} 替换成其他的数据。 如果用 innerHtml 来替换的话，a标签的事件就会消失。 如何达到我说的目的呢？

ps：angular 框架实现了这样了可以随意替换内容，但是不知道它是如何实现的。

  • 写回答

6条回答 默认 最新

  • Hover_Z_快跑 2016-06-25 01:15
    关注

    使用 delegate，即事件委派。
    该方法的事件处理程序适用于当前或未来的元素（比如由脚本创建的新元素）。
    简单例子：

     <!DOCTYPE html>
<html>
<head>
    <title></title>
    <script type="text/javascript" src="../js/jquery.min.js"></script>
    <script type="text/javascript">
    var index = 1;
    var liItem = "hello ";
    $(document).ready(function(){
        $("#test").on("click","li",function(event){
            console.log(event.target.innerHTML);
            alert(event.target.innerHTML);
        });
        $("#addLi").on("click",function () {
            // body...
            $("#test").append("<li>"+liItem+index+"</li>");
            index += 1;
        })
    });

    </script>
</head>
<body>
<div>
<button id="addLi">add Item</button>
<lu id="test">
    <li>helllo 0</li>
    </lu>
</div>
</body>
</html>
    本回答被题主选为最佳回答 , 对您是否有帮助呢?
    评论
查看更多回答(5条)

报告相同问题？

问题事件

  • 已采纳回答 12月20日

悬赏问题

  • ¥15 Vue3 大型图片数据拖动排序
  • ¥15 划分vlan后不通了
  • ¥15 GDI处理通道视频时总是带有白色锯齿
  • ¥20 用雷电模拟器安装百达屋apk一直闪退
  • ¥15 算能科技20240506咨询（拒绝大模型回答）
  • ¥15 自适应 AR 模型 参数估计Matlab程序
  • ¥100 角动量包络面如何用MATLAB绘制
  • ¥15 merge函数占用内存过大
  • ¥15 使用EMD去噪处理RML2016数据集时候的原理
  • ¥15 神经网络预测均方误差很小 但是图像上看着差别太大