如何将自动完成或 keydown 绑定到动态创建的跨度？

Posted 2023-05-08

【中文标题】如何将自动完成或 keydown 绑定到动态创建的跨度？

【英文标题】：How to bind autocomplete or keydown to dynamically created span?

【发布时间】：2021-08-06 19:14:43

【问题描述】：

最终更新 - 我将这个问题标记为已解决。我最终选择了Bootstrap Suggest 来满足我的需要。

更新 - 在 this post 和一些 cmets 的帮助下，我已经能够使用输入字段来完成这项工作。我需要一些帮助才能让它与div、span 或可以内嵌文本的东西一起运行。

我无法在动态创建的 span 上触发自动完成或 keydown 事件。

正如您在my JSFiddle 中看到的，我可以在新元素上绑定click 事件并且它工作正常，但keydown 或autocomplete 似乎都不起作用。自动完成是否必须在输入字段上？我认为它可以在span 上工作（这就是我首先创建span 的全部原因）。

我已尝试关注现有帖子（如下所列），但没有运气。

How do you bind jQuery UI autocomplete using .on()? How can I add jquery ui autocomplete to a dynamically created element? Bind jQuery UI autocomplete using .live()

我做错了什么？我是否忽略了一些明显的东西？我在自动完成功能中设置了断点，它实际上从来没有命中它们

【问题讨论】：

嗨，您可以看到 here 在输入上运行良好。

感谢@Swati 的跟进。我现在可以让它与输入一起工作。不过，我需要它能够比 div 中的整个单独的输入字段更好地流动。是否有可能创建一个 div、span 或内联流动的东西？我基本上需要能够像社交媒体平台那样使用主题标签自动完成

然后试试this插件，它也有自动完成功能。

【参考方案1】：

使用 Bootstrap-Suggest 而不是尝试自己滚动。