Skip to main content
adicionou 396 caracteres ao conteúdo
Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Pode fazer desta forma:

functionvar iniciarcampo = document.querySelector("#texto"){;
// flag para impedir que o setInterval seja acionado por mais de 1 evento
var campoflag = documenttrue;

campo.querySelectoraddEventListener("#texto""change", iniciar);
campo.addEventListener("keyup", iniciar);
campo.addEventListener("keydown", iniciar);
campo.addEventListener("keypress", iniciar);

function iniciar(){

   campo.value = '';
   
   var string = "Olá mundo!"; // texto a ser "digitado"

   if(flag){   
      flag = false;
      var tempo = setInterval(function(){
         var len = campo.value.length;
   
         if(len < string.length){
            campo.value += string.substring(len,len+1);
         }else{
            flag = true;
            clearInterval(tempo);
            console.log("fim!");
         }
      }, 200);
   }
}
<inputPressione type="text"alguma id="texto">tecla do teclado:
<br>
<button<input onclick="iniciar()">Iniciar</button>autofocus type="text" id="texto">

Pode fazer desta forma:

function iniciar(){
   var campo = document.querySelector("#texto");
   var string = "Olá mundo!"; // texto a ser "digitado"
   
   var tempo = setInterval(function(){
      var len = campo.value.length;

      if(len < string.length){
         campo.value += string.substring(len,len+1);
      }else{
         clearInterval(tempo);
         console.log("fim!");
      }
   }, 200);
}
<input type="text" id="texto">
<br>
<button onclick="iniciar()">Iniciar</button>

Pode fazer desta forma:

var campo = document.querySelector("#texto");
// flag para impedir que o setInterval seja acionado por mais de 1 evento
var flag = true;

campo.addEventListener("change", iniciar);
campo.addEventListener("keyup", iniciar);
campo.addEventListener("keydown", iniciar);
campo.addEventListener("keypress", iniciar);

function iniciar(){

   campo.value = '';
   
   var string = "Olá mundo!"; // texto a ser "digitado"

   if(flag){   
      flag = false;
      var tempo = setInterval(function(){
         var len = campo.value.length;
   
         if(len < string.length){
            campo.value += string.substring(len,len+1);
         }else{
            flag = true;
            clearInterval(tempo);
            console.log("fim!");
         }
      }, 200);
   }
}
Pressione alguma tecla do teclado:
<br>
<input autofocus type="text" id="texto">

Fonte Link
Sam
  • 80,8mil
  • 22
  • 73
  • 128

Pode fazer desta forma:

function iniciar(){
   var campo = document.querySelector("#texto");
   var string = "Olá mundo!"; // texto a ser "digitado"
   
   var tempo = setInterval(function(){
      var len = campo.value.length;

      if(len < string.length){
         campo.value += string.substring(len,len+1);
      }else{
         clearInterval(tempo);
         console.log("fim!");
      }
   }, 200);
}
<input type="text" id="texto">
<br>
<button onclick="iniciar()">Iniciar</button>