如何在文本框内创建表情符号选择器按钮？

Question

如何在文本框内添加表情符号选择器按钮以选择表情符号？ 我只能使用CSS和核心JavaScript，而不能使用jQuery。  我需要一个类似表情符号选择器的WhatsApp，可以使用它在文本区域内插入表情符号。enter image description here

Answer 1

如果您不提供想要实现的目标的图像，就很难知道像表情符号选择器之类的WhatsApp是什么意思。

在任何情况下，表情符号都是常规字符，因此您可以简单地创建将表情符号添加到文本区域的按钮，以防用户键盘本身不执行表情符号键入。快速示例：

const add = c => document.querySelector('textarea').value+=c;

<div>
  <button onclick="add('')"></button>
  <button onclick="add('')"></button>
  <button onclick="add('')"></button>
  <button onclick="add('☎️')">☎️</button>
</div>

<textarea rows="5" cols="30">
Type text, or click on an emoji to add it
</textarea>