使用JS或Jquery向动态创建的元素添加事件
可以通过以下步骤实现：
- 首先，确保在动态创建元素之前引入JS或Jquery库。
- 创建一个函数来处理事件的逻辑。例如，如果要为动态创建的按钮添加点击事件，可以创建一个名为"handleClick"的函数。
- 在动态创建元素的代码中，为元素添加所需的属性和内容。例如，如果要创建一个按钮，可以使用JS或Jquery的方法来创建一个按钮元素，并设置其属性和内容。
- 在创建元素的代码之后，使用JS或Jquery的方法选择该元素，并使用".on()"方法来绑定事件。例如，如果使用Jquery，可以使用以下代码将"handleClick"函数绑定到动态创建的按钮的点击事件上：
- 在创建元素的代码之后，使用JS或Jquery的方法选择该元素，并使用".on()"方法来绑定事件。例如，如果使用Jquery，可以使用以下代码将"handleClick"函数绑定到动态创建的按钮的点击事件上：
- 这里的"document"表示整个文档，"#dynamicButton"是动态创建的按钮的选择器，"handleClick"是处理点击事件的函数。
- 如果使用纯JS，可以使用以下代码将"handleClick"函数绑定到动态创建的按钮的点击事件上：
- 如果使用纯JS，可以使用以下代码将"handleClick"函数绑定到动态创建的按钮的点击事件上：
- 这里的"event.target"表示触发事件的元素，"event.target.id"是动态创建的按钮的id属性。
- 最后，实现"handleClick"函数来处理事件的逻辑。可以在该函数中编写所需的代码，例如执行某些操作、发送请求等。
总结起来，使用JS或Jquery向动态创建的元素添加事件的步骤包括引入库、创建处理事件的函数、动态创建元素并设置属性和内容、选择元素并绑定事件、实现事件处理函数。这样可以确保动态创建的元素能够正确地响应所需的事件。
相关·内容
我正在动态创建一个div块。在div中，我有文本字段、一个文件字段和一个超链接。单击超链接时，div标记将从其父标记中删除。转到file字段，我想将onchange事件添加到文件中，这对我不起作用。请检查我的代码，如果我错了，请纠正我？这是我的代码： <div id="incdiv" class="incdiv" name="incdiv">
<div id="increpeatdiv"&g
浏览 18提问于2020-08-22得票数 1
回答已采纳
4回答
我遇到了一个令人沮丧的问题。我想在一个动态添加的输入上添加一个点击事件，但是我已经挣扎了一段时间了。为了显示一些代码，下面是我的初始视图然后，用户可以动态添加数据，然后填充这个div，例如(使用初始div)。<div class="js-item
浏览 8提问于2015-01-10得票数 0
回答已采纳
1回答
当我使用AJAX动态加载JQuery时，带有现有事件的元素会多次触发。
基本上，我有一个名为'myjs.js‘的文件，它保存了我所有的JQuery，并在页面加载时包含在内，因此可以为元素设置事件等。现在，当用户触发一个事件，比如发布新的评论时，它会发送评论(通过Ajax)，然后它会返回一个包含新评论、编辑评论、回复等的页面。显然，当my
浏览 5提问于2011-12-10得票数 1
回答已采纳
1回答
我试图使用jQuery的事件委托.on方法(类似于 JSfiddle )向页面中动态添加的SVG元素添加一个类。(也不按预期工作，先添加圆圈，然后添加边框)
据我所知，它不能工作，因为没有涉及不同元素( svg和button )的事件的传播。我的实际应用程序有一个与d3.js
浏览 2提问于2015-11-04得票数 0
回答已采纳
我想将一个事件附加到JavaScript中的一个元素，问题是我只知道一个简单的事件附件没有参数，但是在这里我想附加一个带有this参数的事件，如下所示我尝试使用Jquery，但是由于元素不是从DOM中选择的，它是一个动态创建的元素，有人可以告诉我如何使用
浏览 12提问于2012-08-08得票数 0
回答已采纳
1回答
编辑:我知道这看起来像一个重复的问题，但它是针对HTML5拖动事件的。我在添加jQuery事件时没有遇到问题，只是HTML5的拖放功能。我曾多次使用basic jQuery向页面添加拖放功能，但我希望在当前项目中使用新的HTML5拖放功能。Drag对于我在HTML中包含的任何元素都很有效，但我似乎不能动态<em
浏览 1提问于2014-11-18得票数 6
3回答
我正在动态地向DOM中添加一些元素。
我想用jQuery的.click()函数来操作这些元素。但是DOM并不是为动态添加的元素触发.click()事件，它只对其他没有由jQuery添加的元素起作用。
浏览 6提问于2014-05-10得票数 1
回答已采纳
我正在使用一个calendar.js文件来实现我的应用程序中的日历。实际上，这个日历.js有一行，它接受我的应用程序的类名和Div id名称。在我的应用程序中，我有以下几行 <div id="calendarDiv"></div>
当我单
浏览 1提问于2009-05-22得票数 0
回答已采纳
6回答
我有一段jQuery，它遍历给定div( #container)中的每个元素，并在每次单击某个跨度时发出javascript警报。如果<span>是静态的，则可以很好地工作。但是，如果我使用如下代码： $("#container").html( <new html with new spans> )我的</e
浏览 39提问于2012-02-28得票数 106
回答已采纳
我有一个DIV元素，它包含动态创建的TEXTAREAs、<input type="file"/>和<input type="checkbox"/>。myxFunction myXjavscript.js:1172f.event.dispatch jquery-1.7.1我只想将上面的事件
浏览 4提问于2013-09-30得票数 0
回答已采纳
目前，我正在使用Vue/Nuxt.js，并试图使用java脚本启动一个引导工具提示。我知道它可以使用jquery初始化，但我需要使用javascript初始化它。下面是我的工具提示代码：在我的Nux
浏览 1提问于2018-09-26得票数 2
2回答
我在试着确保jQuery已经加载了。我试着通过设置它来测试它，这样当你点击一个按钮时，那个按钮就会被移除。这不管用。有人能告诉我我哪里做错了吗？HTML： <script type="text/javascript" src="jquery-1.10.0.min
浏览 1提问于2013-05-25得票数 0
回答已采纳
我有一些代码可以用select2元素创建一个手风琴，这个元素有一个名为docType的类。我还具有jquery代码，用于在选择jquery元素的值时触发事件。虽然这适用于页面加载中已经存在的select2元素，但它不触发动态添加的元素。以下是我的更改代码：
$('.docType').on(
浏览 0提问于2015-12-23得票数 4
回答已采纳
2回答
使用angularjs指令，我将一个事件侦听器添加到一个动态创建的HTML元素中，该元素被插入到DOM中。我已经为这个问题创造了一个小提琴：。我将
浏览 6提问于2014-04-29得票数 3
回答已采纳
1回答
我正在使用一个jquery插件来创建一个输入数字微调器。它不能像预期的那样在动态加载的html元素上工作。当前代码是 minimum: 1, step: 1,我想我需要使用如下内容将其注册到新添加的内容中static-element').on('the event
浏览 14提问于2017-07-14得票数 1
以这个场景为例：
您希望为wordpress、drupal或基本上任何使用第三方功能的站点构建jquery插件。由于您无法提前了解每个特定事件和选择器，因此需要针对如何向动态创建的元素添加jquery/javascript功能。另外，您不知道如何创建元素(使用ajax/php/etc进行回调)。示例
浏览 1提问于2014-06-07得票数 5
存在一个可以动态添加元素的页面，当前添加元素时，也会添加click事件。'status';div.children.add(statusButton); 这很好用，但我更喜欢为所有未来的元素添加一个单击事件statusButtons;
statusButtons = div.q
浏览 19提问于2019-07-03得票数 1
scope.jsonData = response;
$scope.ngData = response.data;从json数据创建的表如下所示
浏览 4提问于2017-06-08得票数 0
回答已采纳
2回答
因此，我有一个行，它包含一个数组名为“something[]”的输入，它能够添加一个按钮，如果单击该按钮可以动态地添加另一行，该按钮具有相同的数组名"something[]"，而我在测试时注意到，我为输入键创建的脚本只适用于第一行任何帮助都是非常感谢的，谢谢。 $("#table").each(function () {
var td
浏览 2提问于2021-04-16得票数 0
回答已采纳
扫码
添加站长 进交流群
领取专属 10元无门槛券
手把手带您无忧上云
相关资讯
热门标签
云服务器
ICP备案
实时音视频
对象存储
即时通信 IM活动推荐
腾讯云开发者
