Stop-Looping Text aber läuft immer noch die Wirkung

Question

Example

var text = 'ENTER...'; 
var chars = text.split(''); 
var enter = document.getElementById("enter") 
var i = 0; 
setInterval (function(){ 
    if (i < chars.length){ 
     enter.innerHTML += chars[i++]; 
    }else{ 
     i = 0; 
     enter.innerHTML = ""; 
    } 
}, 200); 

Ich versuche, diese Eingabe zu haben „enter“ Effekt und ich frage mich, wie es nur einmal gehen zu machen. Also wird "ENTER ..." eingegeben und dann gestoppt. Example

Answer 1

var text = 'ENTER...'; 
var enter = document.getElementById("enter") 
var i = 0; 
(function nextLetter() { 
    enter.innerHTML = text.substr(0, ++i); 
    if (i < text.length) { 
     setTimeout(nextLetter, 200); 
    } 
})(); 

bearbeiten: Sie haben entweder setTimeout (einmal „Schlaf“) zu verwenden, oder Rückgabewert von setInterval erinnern und dass Timer von clearInterval zu zerstören, nachdem Sie es nicht brauchen/wollen, dass es läuft.

Answer 2

var text = 'ENTER...'; 
 
var chars = text.split(''); 
 
var enter = document.getElementById("enter") 
 
var i = 0; 
 
var interval = setInterval (function(){ 
 
    if(i == chars.length) { 
 
     clearInterval(interval); 
 
     return; 
 
    } 
 
    
 
    if (i < chars.length){ 
 
     enter.innerHTML += chars[i++]; 
 
    }else{ 
 
     i = 0; 
 
     enter.innerHTML = ""; 
 
    } 
 
}, 200);

<div id="enter"></div>

Answer 3

Wenn Sie interval, müssen Sie die es mit clearInterval stoppen. Aufhören innen die Intervallfunktion, die als eine Variable deklariert ist, in der if-statement:

var text = 'ENTER...'; 
var enter = document.getElementById("enter") 
var i = 0; 

var interval = setInterval(function() { 
    enter.innerHTML += text[i]; 
    i += 1; 
    if(i === text.length) { 
     clearInterval(interval); 
    } 
}, 200); 

JSFiddle