键入文本过快时，自动选择 (addRange) 方法无法正常工作

问题描述

虽然在第 4 行（“Apple”）中输入文本的速度非常快（“Apple”），但自动选择无法按预期正常工作。但是在编辑单个文本时，它按预期工作（选择工作）。请检查下面的 html 示例

https://jsplayground.syncfusion.com/3ruatvy0

HTML5 可编辑表格

苹果 橙色的 芒果

</table>

 <script>
      
     
         var data = [];

$("table tr").each(function(i,v){
    $(this).children('td').each(function(ii,vv){
        data.push($(this).text());
    }); 
})
console.log(data);
           document.getElementById("table").addEventListener("keyup",event => {
      for (var i = data.length -1 ; i > 0; i--) {
        var cell = data[i - 1];
        if (
          event.key == "Backspace" ||
          event.key == "Delete" ||
          event.key == "Escape"
        ) {
          return;
        } else if (cell) {
          var elem = document.getElementById("editable");
          var textLen = elem.innerHTML.length;
          if (
            elem.innerHTML.toupperCase() ==
            cell.toupperCase().slice(0,textLen)
          ) {
            elem.innerText = cell;
            var startNode = document.getElementById(
              "editable"
            ).firstChild;
            startNode.nodeValue = startNode.nodeValue.trim();
            var range = document.createrange();
            range.setStart(startNode,textLen);
            range.setEnd(startNode,startNode.textContent.length);
            var sel = window.getSelection();
            sel.removeAllRanges();
            sel.addRange(range);
            return;
          }
        } else return;
      }
    });
   
    </script>

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）