Javascript用字符串替换onKeyUp事件

Javascript Replace onKeyUp event with a string

本文关键字：onKeyUp 事件 替换 字符串 Javascript      更新时间：2023-09-26

我不太擅长JavaScript，需要一个我认为简单的脚本。基本上，我有一个输入框，当用户键入一个键时，它将消失，并更改为我拥有的任何字符串。我只能换一封信，这样我就有东西来表达我的意思了。因此，每当用户键入消息时，它都会被替换为"h"，但我想要的是让"hello"一个字母接一个字母地键入，而不是一直只键入"h"而不是一次键入"你好"。

这是代码。

<form action=# name=f1 id=f1 onsubmit="return false">
<input type=text name=t1 id=t1 value="" size=25 style="width:300px;" 
    onkeypress="if(this.value.match(/'D/))"
    onkeyup   ="this.value=this.value.replace(/'D/g,'h')">
</form>

刚刚编辑，给JS带来错误希望你会介意：你在尝试这样的东西吗：

function replaceString(el){
	var sampleText = "hello".split("");
  var value = "";
  console.log(el)
  el.value.split("").forEach(function(str, index){
  	value += sampleText[index%sampleText.length];
  });
  el.value = value;
}
<form action=# name=f1 id=f1 onsubmit="return false">
<input type=text name=t1 id=t1 value="" size=25 style="width:300px;" 
    onkeypress="if(this.value.match(/'D/));"
    onkeyup   ="replaceString(this);"/>
</form>

如果您想模拟在文本框中键入文本，则需要使用超时。以下功能就足够了：

function simulateTyping(str, el)
{
    (function typeWriter(len)
    {
      var rand = Math.floor(Math.random() * (100)) + 150;
      if (str.length <= len++)
      {
        el.value = str;
        return;
      }
      el.value = str.substring(0,len);
      if (el.value[el.value.length-1] != ' ')
        el.focus();
      setTimeout(
        function()
        {
          typeWriter(len);
        },
        rand);
    })(0);
}

您需要向它传递两个参数：要键入的字符串（例如"hello"）和要在其中键入字符串的元素。这里有一个简单的包装器函数：

function typeHello() {
  var el = document.getElementById('t1');
  var str = 'hello';
  simulateTyping(str, el);
}

当您调用typeHello函数时，它会找到id为"t1"的元素，并键入"hello"文本。

相关文章：