js教程

动态生成元素触发事件无效的解决方法

我的站长站 2020-08-09 人阅读

在写JS时,我们在处理动态生成的HTML触发事件时,会无效。比如:

$("body").html("<b>I Love www.wdzzz.com</b>");
$("b").click(function(){alert(123)})

你会发现点击B标签,并不会触发alter弹窗。具体逻辑原因我的站长站没深究,希望研究的可以去网上看看。

这里我的站长站只分享方法,会用到JQ的.on语法。

$("body").html("<b>I Love www.wdzzz.com</b>");
$("body").on("click","b",function(){
alert(123)
});

这个就相当于重新选取了一次,从body开始一直到下面的b标签,这样就可以重新触发生成的B标签事件了。

当然里面的click点击事件也可以换成其他任何事件。

写的不是非常专业,希望能够帮助大家。

最新更新
  • js截取字符串教程

    slice()方法接受两个参数,起始索引和结束索引(可选)。它返回从起始索引到结束索引(不包括结束索引)之间的子字符...

    js教程 3个月前
  • find findIndex indexOf索引选择器使用方法

    find使用方法find方法是ES6引入的一种数组方法,可以用来查找数组中符合条件的元素。语法是:array.find(callba...

    js教程 3个月前
  • js复制网页内容教程

    Async Clipboard API方法HTML5新增的方法,无需引入第三方插件,直接就可以复制内容。低版本的浏览器可能会不兼...

    js教程 3个月前
  • js获取字符长度函数分享

    js获取字符长度函数function objLen(str) { if (str == null) return 0; if (typeof str != "string") { ...

    js教程 3个月前
  • 网站LED跑马灯效果广告代码

    网站可以看到很多的论坛网站都会用到这种网站LED跑马灯效果,这种效果实现也很简单,分享给大家。LED跑马灯效果...

    js教程 4个月前