jQuery粘贴文本，就好像它被键入

Question

stackoverflowers。 我正在开发一个自动完成应用程序，该应用程序需要逐个字符地捕获输入文本，而我目前正在使用jquery监听“ input”事件。

我面临的问题是粘贴文本，因为该函数是通过整个输入值触发的，如下所示：

粘贴的值=“演示”

input.val() = "demo"

但是，我要实现的是分解粘贴的值，就像它实际上是键入的一样，并像这样触发4次：

粘贴的值=“演示”

input.val() = "d"
input.val() = "de"
input.val() = "dem"
input.val() = "demo"

你们能给我一些有关如何使用香草JS或Jquery解决此问题的提示或指导吗？

提前致谢。

Answer 1

尝试以下方法：

<input type="text">
<div></div>

<script> 
  var myInput = $("input");
  var value = ''; //to store previous input value

  myInput.on('input', function () {
    var current = myInput.val();
    var dif = current.replace(value, '');
    if(dif.length) {
      var out = value;
      for(var i = 0; i < dif.length; i++) {
        out += dif.substr(i, 1);
        output(out);
      }
    }
    value = current;
  });

  function output(text) {
    console.log(text);
    $("div").text(text);
    // here you can even to re-set input value via myInput.val
  }
</script>

尝试输入“ 1”，“ 2”，“ 345”，您将在控制台日志中获得“ 1”，“ 12”，“ 123”，“ 1234”，“ 12345”。

仅当将文本追加到输入末尾时，此方法才有效。 如果您不仅需要在输入末尾插入文本，还应该更新该过程。

另请参阅“ 柱塞” 。

Answer 2

我认为您可以在将输入显示到屏幕之前检查输入的长度。