问题陈述:使用 javascript 或 Jquery，我想构建此功能，如果用户在文本框中键入指定的字符(例如 @ 符号)，则数组的值应显示在下拉列表中。比如说我有一个带有值的数组: 值[yyyy,yy]
当用户输入:abc@时 然后 @ yyyy 和 yy 之后应该出现在下拉列表中。 就像当我们在 Whatsapp 群组中写@符号时，它会显示该群组的联系人列表。这个功能与此类似。 此外，它与普通的自动建议不同，普通的自动建议在用户键入内容时显示建议。它与 jquery 自动完成功能不同，后者根据文本框中的输入显示建议。在这里，我们希望在用户键入 @ 符号时在下拉列表中显示预定义列表的值，而不是基于文本框中的整个输入。
请专家帮助实现这一目标。
最佳答案
基本实现:
您可以在输入/某些特定元素中的按键上附加一个监听器(也可以是 contenteditable div)
然后您可以检查用户是否按下了@键。
let element = document.getElementById('#some-element');
element.addEventListener('keydown', function(event) {
const key = event.key;
if (key === '@') {
displaySuggestions();
}
});
一旦用户按下“@”键，您就可以调用 displaySuggestions() 函数。
这将是一个您可以构建的简单组件，当用户单击建议中的任何值时，您可以在插入符号位置插入该值。
引用以下内容:Insert text into textarea at cursor position (Javascript)
有很多库都很好地提供了此功能，您可能需要查看它们。
<小时/>更新:
我在codesandbox上做了一个小项目，你可以点击以下链接查看:
这将有助于作为一个起点。
我已经记录了解释该行为及其如何完成的代码。 在示例中，我使用了 contenteditable div，并且该示例肯定没有针对性能进行优化，但可以围绕它做很多事情来改进它。
我同意存在大量错误，所有这些问题都可以解决，但在 20-30 分钟内，这就是我能做的。
总结一下: 您可以从中获取灵感或继续编辑此内容或提出更好的解决方案。 其他人可能对此有很好的解决方案，我期待着他们。 愿 Javascript 的力量与您同在。
这是正在运行的项目:
关于javascript - 当用户在文本框中键入指定字符时显示建议，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/52429449/