Settimout不工作For循环，行事怪异？

我试图用JavaScript模拟打字机效果。 Theorically它应该与我的代码工作：Settimout不工作For循环，行事怪异？

function TypeWriteToDoc(txt, id, x){ 
document.getElementById(id).innerHTML = document.getElementById(id).innerHTML + txt.charAt(x); 
} 

function TypeWrite(txt,id){ 
for (var i = 0; i < txt.length; i++){ 
    setTimeout(function() { 
    TypeWriteToDoc(txt, id, i); 
    }, 1000*(i+1)); 
    } 
}

这应该是它，当我打电话TypeWrite("example", "p_test");应该在“p_test” HTML写“测试”的每个字符。我认为这个问题它不是对，因为我的呼唤，而无需使用setTimeout它的工作原理的功能等在下面的代码我的代码：

function TypeWriteWithNoSettimeout(txt, id){ 
for (var i = 0; i < txt.lenght; i++){ 
    TypeWriteToDoc(txt, id, i);} 
}

来源

2017-10-28 Gerard Marquina

这是什么问题？你似乎说你的代码不起作用，但你没有说出什么问题。 – Carcigenicate

它根本不起作用。上面的代码“setTimeout”什么都不做。 –

这是在for循环与回调函数var的共同课题。

最简单的解决方案？改为使用let。 let支持all major browsers。

function TypeWrite(txt,id){ 
for (let i = 0; i < txt.length; i++){ 
    setTimeout(function() { 
    TypeWriteToDoc(txt, id, i); 
    }, 1000*(i+1)); 
    } 
}

来源

2017-10-28 18:12:56 SamVK

类似以前的回应，而不是与div.innerHtml一起追加原文，我调整了它是只是文本字符来模拟更多打字机的感觉。为了增加延迟，我把这个指数乘以1000而不是增加它，因为更大的增量更明显。

function TypeWriteToDoc(txt, id, i) { 
 
    setTimeout(function() { 
 
    var div = document.getElementById(id) 
 
    div.innerHTML +=txt.charAt(i) 
 
    }, 1000 * (i)) 
 
} 
 

 
function TypeWrite(txt,id){ 
 
    for (var i = 0; i < txt.length; i++) { 
 
    TypeWriteToDoc(txt, id, i) 
 
    } 
 
} 
 
    
 
TypeWrite('example', 'p_test')

<div id="p_test"></div>

来源

2017-10-28 18:19:27 Gary

Settimout不工作For循环，行事怪异？

回答

相关问题