Question

我最大的问题是，在它被替换之后，光标默认为textarea的末尾。如果我打字，这不成问题，但如果我回去编辑，那真的很烦人。这就是我尝试的内容（textarea的ID是＆＃34; area＆＃34;）

var el = e.area;

  position = el.selectionStart; // Capture initial position

      el.value = el.value.replace('\u0418\u0410', '\u042F');
  el.selectionEnd = position;    // Set the cursor back to the initial position.

Answer 1

您可以尝试以下代码段。在其当前形式中，它将==替换为+，但它允许将任何字符串替换为更短或更长的字符串。

为了保持光标位置，您必须保存并恢复selectionStart和selectionEnd。计算偏移量以计算两个字符串之间的长度差异以及光标前的出现次数。

使用setTimeout可确保在处理之前已在文本中插入新键入的字符。

var area = document.getElementById("area");

var getCount = function (str, search) {
    return str.split(search).length - 1;
};

var replaceText = function (search, replaceWith) {
    if (area.value.indexOf(search) >= 0) {
        var start = area.selectionStart;
        var end = area.selectionEnd;
        var textBefore = area.value.substr(0, end);
        var lengthDiff = (replaceWith.length - search.length) * getCount(textBefore, search);
        area.value = area.value.replace(search, replaceWith);
        area.selectionStart = start + lengthDiff;
        area.selectionEnd = end + lengthDiff;
    }
};

area.addEventListener("keypress", function (e) {
    setTimeout(function () {
        replaceText("==", "+");
    }, 0)
});

<textarea id="area" cols="40" rows="8"></textarea>

在.replace（）

1 个答案: