Javascript JS/jQuery/CSS下拉式建议框，如Sublime'；s

我目前正在制作一个web应用程序编辑器，我已经实现了建议框。现在，这个建议框固定在页面顶部，但我希望在我当前键入的文本下面弹出一个建议框。升华的建议箱正是我想要的：

我尝试过搜索如何实现这类功能的技巧，但我从搜索中得到的只是静态字段（如不移动的搜索框）或下拉菜单。我希望建议框在我正在键入的当前单词的正下方弹出，这意味着它无法固定到特定位置

---

从哪里开始有什么建议吗？谢谢

有趣的想法，到目前为止我的想法（未尝试组合）如下所示。很抱歉没有提供很多链接，但我认为每个部分都足够小，可以按需查找

框本身

通过无序列表，

ul

可以构建这样的建议框。只需将其格式化为最大大小，即可使用

定位

如果要将其放在光标下，我猜您使用的是

textarea

。通过快速搜索，有一个，它为您提供文本光标的窗口坐标。我们现在有了一个位置，可以用来定位盒子，很好。提示：这是一个固定的位置，只需为每个新角色更新它

互动

到目前为止，我们希望有一个风格和定位的建议框。我会抓取

textarea

值，并将其修剪到光标前面的最后一个单词。这个字符串可以通过AJAX、本地或任何您喜欢使用的工具来查找

一旦你有了一套建议并填写了建议框，至少我希望有键盘支持。要做到这一点，只需为上/下箭头添加键盘侦听器，输入并按tab键。对于这四个键，您还需要防止默认情况下

textarea

对此键做出反应

---

在建议元素上单击侦听器也很有用。单击或tab/enter后，您只需修改光标位置处的

textarea

值。

jQuery有一个插入符号插件，您可以在其中获取插入符号的位置。然后您可以转到

$（textarea）.caret（），然后将框的位置调低几个像素