如何对动态创建的元素触发事件？

Question

我正在使用这样的日期范围选择器：

$('#myInput').daterangepicker({
'param1': value1,
'param2': value2,
'param3': value3,
...
}, function(...) {
...
})

如果我的输入是使用 DOM 创建的，这将正常工作。 但是如果我的输入是在 DOM 之后动态创建的，这不起作用，通常我应该这样做：

$('body').on('daterangepicker..........event', '#myInput', function() {

})

但是不知道怎么弄，谢谢帮忙

Answer 1

只是因为您的 DOM 尚未创建。 所以你可以通过注册元素包装器#my-input来存档

所以这就是你使用“body”并且工作正常的原因。

您可以尝试以下示例

<div id="my-div"> <input id="my-input" /> </div>

$("#my-div").on('daterangepicker..........event', '#myInput', function() {

})

Answer 2

您需要制作一个容器并将其注入。

 $(function() { let html = document.getElementById('container'); setTimeout(() => { // Dynamically adding datepicker html.innerHTML = '<input type="text" id="datepicker"/>'; // let dp = document.getElementById('datepicker'); dp.classList.add('DatePicker'); $('.DatePicker').datepicker(); }, 500) });

 <html lang="en"> <head> <meta charset="utf-8" /> <link rel="stylesheet" href="https://code.jquery.com/ui/1.10.3/themes/smoothness/jquery-ui.css" /> <script src="https://code.jquery.com/jquery-1.9.1.js"></script> <script src="https://code.jquery.com/ui/1.10.3/jquery-ui.js"></script> </head> <body> <div id="container"></div> </body> </html>

如何对动态创建的元素触发事件？

问题描述

2 个解决方案

解决方案1
1 2019-12-09 09:41:57

解决方案2
1 2019-12-09 10:18:03

如何对动态创建的元素触发事件？

问题描述

2 个解决方案

解决方案1 1 2019-12-09 09:41:57

解决方案2 1 2019-12-09 10:18:03

解决方案1
1 2019-12-09 09:41:57

解决方案2
1 2019-12-09 10:18:03