textarea首词匹配时previous()函数无法循环定位至最后匹配项的问题求助

嘿，我刚仔细扒了你的代码，发现问题出在lastIndexOf的参数处理逻辑上！当你当前定位到第一个Love（也就是索引0的位置）时，点击Previous按钮，currentMatchIndex - 1会得到-1，而JS里lastIndexOf的第二个参数如果是负数，会被自动当作0处理。这时候text.lastIndexOf("Love", 0)会返回0（因为索引0的位置正好是Love的起始点），代码就会进入startIndex !== -1的分支，把currentMatchIndex保持在0，自然就不会跳转到最后一个匹配项了。而像never这种第一个匹配不在索引0的情况，currentMatchIndex -1是正数，lastIndexOf能正确返回-1，从而触发循环到最后一个匹配的逻辑。

想要一个健壮且少条件判断的解决方案，我建议换个思路：先把所有匹配项的起始索引收集到一个数组里，然后通过数组的索引来导航，这样就能完全避开字符串搜索的边缘问题。具体修改如下：

首先，写一个函数来获取所有匹配的索引：

function getAllMatchIndices(text, term) {
  const indices = [];
  let startIndex = 0;
  while (true) {
    startIndex = text.indexOf(term, startIndex);
    if (startIndex === -1) break;
    indices.push(startIndex);
    startIndex += term.length; // 避免重复匹配同一个位置（比如连续相同字符的场景）
  }
  return indices;
}

然后修改全局变量和导航函数：

let currentMatchArrayIndex = -1; // 现在跟踪的是匹配数组的索引，不是字符串位置
let matchIndices = []; // 存储所有匹配的起始索引

function resetIndex() {
  currentMatchArrayIndex = -1;
  matchIndices = [];
}

function highlightMatch(startIndex, endIndex) {
  const textarea = document.getElementById('myTextarea');
  textarea.setSelectionRange(startIndex, endIndex);
  textarea.focus();
}

function next() {
  const findTerm = document.getElementById('findInput').value.trim();
  const textarea = document.getElementById('myTextarea');
  const text = textarea.value;

  if (!findTerm) return;

  // 如果匹配数组为空，先获取所有匹配项
  if (matchIndices.length === 0) {
    matchIndices = getAllMatchIndices(text, findTerm);
  }

  if (matchIndices.length === 0) {
    alert("Find term not found.");
    return;
  }

  // 循环切换到下一个索引
  currentMatchArrayIndex = (currentMatchArrayIndex + 1) % matchIndices.length;
  const currentPos = matchIndices[currentMatchArrayIndex];
  highlightMatch(currentPos, currentPos + findTerm.length);
}

function previous() {
  const findTerm = document.getElementById('findInput').value.trim();
  const textarea = document.getElementById('myTextarea');
  const text = textarea.value;

  if (!findTerm) return;

  if (matchIndices.length === 0) {
    matchIndices = getAllMatchIndices(text, findTerm);
  }

  if (matchIndices.length === 0) {
    alert("Find term not found.");
    return;
  }

  // 循环切换到上一个索引，处理负数的情况
  currentMatchArrayIndex = (currentMatchArrayIndex - 1 + matchIndices.length) % matchIndices.length;
  const currentPos = matchIndices[currentMatchArrayIndex];
  highlightMatch(currentPos, currentPos + findTerm.length);
}

HTML部分保持原样即可。

这个方案的优势很明显：

• 逻辑更清晰，所有匹配项提前收集，导航时只需要操作数组索引，完全不用处理字符串搜索的边缘情况
• 自动处理循环逻辑，不管是Next到最后还是Previous到第一个，都能正确跳转
• 避免了大量的条件判断，代码更简洁健壮

你可以试试这个修改，不管搜索词在什么位置，Previous和Next按钮都能正常循环跳转了。

备注：内容来源于stack exchange，提问作者Mori