无法使用 jQuery 定位动态生成的元素

Posted 2023-03-14

【中文标题】无法使用 jQuery 定位动态生成的元素

【英文标题】：Cannot target dynamically generated element with jQuery

【发布时间】：2018-01-15 00:14:29

【问题描述】：

One of the pages I'm working on 有一个包含表单的模式，当在大多数移动 ios 设备上查看时，当每个输入聚焦时，插入符号/光标会显示在错误的位置。许多人报告了这个问题，包括this page here。

根据他们的建议，我试图编写一些 JS 来隐藏正文内容等。我很难绑定到 .new-appt 和 .timeslot 元素的点击事件。

我试过了：

A)jQuery('.new-appt').click(function() alert(); );

B)jQuery('.timeslot').click(function() alert(); );

C)jQuery(document).on('click', '.new-appt', function() alert(); );

D)jQuery(document).on('click', '.timeslot', function() alert(); );

E)jQuery(document).live('click', '.new-appt', function() alert(); );

F)jQuery(document).live('click', '.timeslot', function() alert(); );

当粘贴在控制台中时，A 到 D 似乎触发正常，但不是在脚本块中。我也尝试将它们放在jQuery(document).ready 中，但这似乎没有帮助。

任何建议表示赞赏。

【参考方案1】：

在这些 DOM 元素准备好之后，您必须将事件侦听器附加到元素。在这种情况下，它是模态中的 DOM 准备就绪的时刻。所以基本上你应该在处理程序底部注册点击事件，打开并创建这个模式的内容。