通过单击按钮更改文本区域中的插入符号位置

Change caret position in textarea by click on button

我有一个包含以下内容的文本区域:

[supreme] a test text or anything [/supreme]

我也有一个按钮。 我想在单击按钮时选择文本区域并将插入符号位置更改为此:

[supreme] a test text or anything  <caret postion> [/supreme]

我如何使用 javascript 或 jquery 执行此操作?

谢谢。

这是一个简单的例子。它可以做得更干净,但它应该让你开始。

$(document).ready(function() {
  $('.button').click(function(e) {
    var $textArea = $('.textArea');
    var prevValue = $textArea.val();
    $textArea.focus().val('').val(prevValue);
  });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<textarea class="textArea">a test text or anything</textarea>
<button class="button">
CLick Me
</button>