Question

stackoverflowers。我正在开发一个自动完成的应用程序，需要逐个字符地捕获输入文本，而我现在正在收听＆＃34;输入＆＃34; jquery事件。

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

粘贴值=＆＃34;演示＆＃34;

input.val() = "demo"

但是，我希望实现的目的是将粘贴的值分解为实际输入的值，然后像这样触发该函数4次：

粘贴值=＆＃34;演示＆＃34;

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

你们可以给我一些关于如何用vanilla 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>

尝试输入＆＃34; 1＆＃34;，＆＃34; 2＆＃34;，＆＃34; 345＆＃34;你会得到＆＃34; 1＆＃34;，＆＃34; 12＆＃34;，＆＃34; 123＆＃34;，＆＃34; 1234＆＃34;，＆＃34; 12345＆＃34;在控制台日志中。

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

另见Plunker。

Answer 2

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

粘贴文本上的Jquery，就好像它是键入的一样

2 个答案: