使用setTimeout（）使用動畫鍵入的文本不起作用

-3

我試圖製作一個程序，該字段使用動畫在字段中鍵入文本。但它不起作用。爲什麼？？？使用setTimeout（）使用動畫鍵入的文本不起作用

var str = "SuperUser"; 
var i = 0; 
var inp = document.getElementsByTagName("input")[0]; 

function enter(str, elem, i){ 
    elem.value += str[i]; 
    i++; 
    setTimeout(enter(str, inp, i), getRandomInt(500, 2000)) 
} 
setTimeout(enter(str, inp, i), getRandomInt(500, 2000)) 

function getRandomInt(min, max) { 
    return Math.floor(Math.random() * (max - min)) + min; 
}

錯誤截圖：

來源

2016-12-28 Vlad Gavriuk

請界定「不起作用「。另外，描述你想要你的代碼做什麼，以及它做什麼。然後，您需要了解函數調用和函數引用之間的區別。 – Teemu

並不包括錯誤的截圖，將實際的錯誤文本複製到您的問題中，以便搜索可以正確編制索引，而其他用戶可以找到它 – 23tux

最好的選擇是將參數'綁定到'輸入'功能。 'enter.bind（this，str，inp，i）' –

setTimeout(enter(str, inp, i), getRandomInt(500, 2000));

這行不通。它在超時執行返回值，這樣做：

setTimeout(function(){ 
enter(str,inp,i); 
},1000);

而且，在你輸入你需要停下來的地方。添加到第一行：

if(i>=str.length){return;}

順便說一句，你不需要傳遞變量嗎更有在全球範圍內：

enter();

一起：

window.onload=function(){ 
var str = "SuperUser"; 
var i = 0; 
var inp = document.getElementsByTagName("input")[0]; 
    function enter(){ 
    if(i>=str.length){return;} 
    inp.value += str[i]; 
    i++; 
    setTimeout(enter, getRandomInt(500, 2000)); 
} 
enter(); 
function getRandomInt(min, max) { return Math.floor(Math.random() * (max - min)) + min; } 
};

來源

2016-12-28 09:57:54

非常感謝！ –

您遞歸調用enter(str, inp, i)功能。這就是爲什麼它超過堆棧內存。 沒有停止條件。

var str = "SuperUser"; 
 
var i = 0; 
 
var inp = document.getElementsByTagName("input")[0]; 
 

 
function enter(str, elem, i){ 
 
    elem.value += str[i]; 
 
    i++; 
 
    setTimeout(enter(str, inp, i), getRandomInt(500, 2000)); 
 
} 
 
enter(str, inp, i); 
 

 
function getRandomInt(min, max) { 
 
    return Math.floor(Math.random() * (max - min)) + min; 
 
}

<input type="text"> 
 
<input type="text"> 
 
<input type="text">

來源

2016-12-28 09:55:03

使用setTimeout（）使用動畫鍵入的文本不起作用

回答

相關問題