jquery - 文本区域的自动完成弹出窗口

标签 jquery html autocomplete

我正在尝试在我的网络应用程序中构建一个用户名自动完成功能,因此当您键入 @ 符号时,会出现一个带有箭头的小弹出窗口指向您的 @ 符号,它在您继续键入用户名时进行过滤(并单击完成)。

我可以完成其中的大部分工作,但是我遇到的主要问题是在 x 和 y 中获取一些坐标,我可以使用这些坐标来定位弹出框...

这里是我正在研究的 JSFiddle Fiddle 的引用。http://jsfiddle.net/tarnfeld/Xefdb/3/

为了让主要功能正常工作,我有一个小的红色范围,我想将其移动到插入符号位置(小 | 符号作为您的输入),这样我就可以进一步扩展它,使其成为令人敬畏的自动完成爱。

任何帮助将不胜感激:)

谢谢!!

PS:我找到了这样的答案Twitter-style autocomplete in textarea但它们不会在@char 位置下弹出...

最佳答案

这看起来很复杂。基本上,您必须获取当前字符 位置并将其转换为 X/Y 坐标。

我发现以下链接可能对您有帮助:

计算 x/y 位置是棘手的部分。两种解决方案(第二个和第三个链接)都会创建临时元素(<div><textarea>)并用计算其高度/宽度的文本连续填充它们。

HTH.

关于jquery - 文本区域的自动完成弹出窗口,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/7695853/

相关文章:

jquery - 单击按钮时暂时禁用悬停 (jQuery)

angular - 使用虚拟滚动调整下拉菜单的高度 Angular7 自动完成

jquery - IE 的鼠标悬停选项

javascript - 如何在 Github Issue on create (API) 上发表评论

javascript - 让一个选择元素影响另一个元素

html - @font-face 不适用于特定版本的 Internet Explorer 11

android - 在 Android 中将文本转换为 HTML

javascript - 通过 1.2.6 上的脚本事件触发 Jquery 自动完成

ios - 如何在文本字段中执行多个自动完成?

jquery - HandleBar 模板 & jQuery 移动 & 动态 ListView