javascript - 如何使用Javascript在textarea内添加按钮？

Question

我的客户希望我在里面创建一个文本区域，其中必须有一个如下图所示的按钮:

进入上图，请按照图片右侧的位置，您可以看到蓝色的括号是按钮。
这必须像第二张图片一样点击(如下拉):

在第二张图片中，我们可以看到，单击大括号按钮后，列表已打开，单击列表中的一个选项正在 Textarea 上写入。但是这整个事情应该在客户端工作，即使用我很新的 Javascript 或 Jquery。所以，我无法开始。我需要您对上述有关如何实现以下目标的明智建议，同时我也在做我的研究，如果我知道任何事情，那么我会更新我的问题或回答我的问题。提前致谢。

Answer 1

为此，您可以将 textarea 和按钮放在具有 position: relative 的同一个 div 中。设置它。然后您可以制作按钮 position: absolute并将其放在右上 Angular 。像这样的东西:

.textarea-container {
  position: relative;
}
.textarea-container textarea {
  width: 100%;
  height: 100%;
  box-sizing: border-box;
}
.textarea-container button {
  position: absolute;
  top: 0;
  right: 0;
}

<div class="textarea-container">
  <textarea name="foo">Some content here...</textarea>
  <button>Menu</button>
</div>

我会根据需要将样式留给您完成。