腾讯云

文章/答案/技术大牛

发布

社区首页 >问答首页 >如何在动态更改innerHTML后重新添加点击监听器？

问如何在动态更改innerHTML后重新添加点击监听器？
EN

Stack Overflow用户

提问于 2017-10-31 13:23:46

回答 1查看 62关注 0票数 0

我正在尝试将标签转换为Shopify商店中通过第三方应用动态加载的内容中的标签，这意味着HTML是在页面加载完成后添加的。在我进行转换之前，标签已经通过第三方脚本添加了'click‘事件侦听器。

我当前的代码如下所示：

var widgetHTML = $(".cbb-frequently-bought-selector-list").html();
widgetHTML = widgetHTML.replace(/<a /g, '<span ').replace(/<\/a>/g, '</span>');
$('.cbb-frequently-bought-selector-list').html(widgetHTML);

在这段代码执行之后，原来的“click”事件侦听器就消失了。

有没有办法在所有标签上临时保存对所有现有'click‘事件侦听器的引用，然后执行上面的代码，然后将'click’事件侦听器重新添加到替换了这些标签的新标签上？

jquery

html

dom

replace

addeventlistener

回答 1

Stack Overflow用户

发布于 2017-10-31 13:26:11

像这样使用jQuery的事件委派：

$(document).on('click','your_element_selector', function() {
   // your code    
});

票数 0

页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持

原文链接：

https://stackoverflow.com/questions/47036559

复制

如何实现动态添加的元素添加点击事件

javascript jquery

在页面开发过程中常常遇到需要动态添加元素，然后给这一元素绑定相关事件的情况，这种情况下一般需要给元素加上相关属性，然后写这些元素的事件函数即可。动态添加的元素怎么绑定事件呢？

前端老道

2022/03/29

4K0

【Java 进阶篇】JavaScript 动态表格案例

java javascript 表格函数事件

在这篇博客中，我们将深入了解JavaScript如何创建和操作动态表格。我们将从头开始构建一个动态表格，并逐步添加各种功能，使其能够实现数据的添加、删除和编辑。这个示例将有助于理解如何在前端开发中使用JavaScript创建交互性强大的表格。

繁依Fanyi

2023/10/19

3470

jQuery实现动态添加和删除（点击按钮添加在页面添加和删除元素）

form 表单

1：点击添加按钮弹出弹框，form表单可以填写相关的信息 2：点击保存按钮，相关信息会显示在界面的列表里

王小婷

2019/02/26

7.3K0

如何在Vue中动态添加类名

vue.js 小程序编程算法

能够向组件添加动态类名是非常强大的功能。它使我们可以更轻松地编写自定义主题，根据组件的状态添加类，还可以编写依赖于样式的组件的不同变体。

前端小智@大迁世界

2020/05/12

6.2K0

如何在 TypeScript 中为对象动态添加属性？

typescript

在 TypeScript 中，我们经常需要在运行时动态添加属性到对象上。这是因为 TypeScript 是一种静态类型语言，类型系统在编译时会检查代码的类型安全性，所以在编译时我们无法确定对象上将要添加哪些属性。在本文中，我们将讨论如何在 TypeScript 中为对象动态添加属性，以及这样做的一些注意事项。

网络技术联盟站

2023/06/07

11.7K0

动态网页（监听器）

servlet java xml 网站文件存储

它的作用与谍战片中的监听器相同，用来监听或监控你干了什么，只不过谍战片中监听对象是人，而动态网页中监听对象是代码。

全栈开发日记

2022/05/13

6170

entr：文件更改时重新运行构建

git bash linux bash 指令

这是一篇简短的文章。我是最近才发现 entr 的，我很惊奇从来没有人告诉过我？！因此，如果你和我一样，那么我告诉你它是什么。

用户8639654

2021/09/14

6180

点击地图添加Marker

javascript

当我们往地图上添加marker时第一反应都是根据经度和维度来添加，却没有想到可以通过点击地图相应的位置添加marker，所以到底如何实现点击添加marker呢？

算法与编程之美

2021/11/23

1.2K0

quartz监控日志（二）添加监听器

quartz 代理监控源码

上一章介绍监控job有三种方案，其实还有一个简单方案是实现quartz的TriggerListener。

一笠风雨任生平

2019/08/02

1.5K0

apktool重新打包添加签名

apk

一.生成apk apktool b 反编译后项目目录 -o 新apk名称.apk 二.生成签名 keytool -genkeypair -alias 新apk名称.apk -keyalg RSA -validity 100 -keystore app.keystore #拓展 -genkey 生成秘钥 -alias 别名 -keyalg 秘钥算法 -keysize 秘钥长度 -validity 有效期 -keystore 生成秘钥库的存储路径和名称 -keypass 秘钥口令 -storep

小小咸鱼YwY

2020/07/01

7420

Css添加div点击态

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>Document</title> </head> <style> .active { position: relative; width: 120px;

明知山

2020/09/02

4.8K0

【Java 进阶篇】深入了解 JavaScript 的 innerHTML 属性

java javascript innerhtml 事件性能

JavaScript 是前端开发中不可或缺的一部分，它为我们提供了丰富的工具和技术，以便更好地操作和交互HTML页面。在本文中，我们将重点介绍JavaScript中的 innerHTML 属性，它是DOM（文档对象模型）的一部分，用于操作和更改HTML元素的内容。我们将深入了解这一属性的作用、用法和最佳实践，同时通过实际示例来帮助您更好地理解。

繁依Fanyi

2023/10/19

8830

更改host文件_添加host文件

tcp/ip windows github git 开源

国内无法访问GitHub的问题除了用某工具访问，还可以通过host文件来达到效果，缺点就是需要经常更新ip地址。

全栈程序员站长

2022/11/04

3.9K0

jquery导航栏点击及页面跳转后对应栏目添加选中效果

html

但是一般页面的导航栏都是需要跳转页面的，上面的方法只在当前页面有效，跳转后就失效了。

德顺

2019/11/13

4.5K0

【Java 进阶篇】JavaScript DOM Element 对象详解

java javascript dom element 对象

JavaScript是一门广泛用于网页开发的脚本语言，而DOM（文档对象模型）是JavaScript在网页中操作HTML和XML文档的核心。DOM以树状结构表示文档，允许开发者以编程方式访问、操作和修改文档的内容和结构。在DOM中，Element对象是代表HTML元素的关键对象之一。本篇博客将详细介绍JavaScript DOM中的Element对象，帮助基础小白更好地理解和应用这一概念。

繁依Fanyi

2023/10/19

2890

wordpress更改固定链接后404

nginx wordpress 网站建设网站

wordpress的固定链接对于博客的seo优化是非常重要的。因为有些默认设置并不怎么友好，所以我们可以自定义设置自己的想要的固定链接，比如自定义连接结构为：/%post_id%.html。但是往往我们更改之后会出现404页面，这是网站的伪静态出了问题。下面是在不同环境下的不同解决方法。

SweetHunter

2020/05/10

2.1K0

点击加载更多

相似问题

更改innerHTML后，页面会自动重新加载吗？

动态更改innerHTML集

点击链接后的IE innerHTML

在JavaScript .innerHTML更改后重新获取<form>-元素值

删除后重新添加事件监听器--Javascript

122

添加站长进交流群

领取专属 10元无门槛券

AI混元助手 在线答疑

关注 腾讯云开发者公众号

洞察 腾讯核心技术

剖析业界实践案例

问如何在动态更改innerHTML后重新添加点击监听器？
EN