我正在处理 CSS 动画类型的东西，需要在 HTML 的文本框中显示文本，就好像有人正在输入但实际上没有人输入任何文本一样。到目前为止我有这个:
<html>
<head><style>
input, input:focus {
border:none;
}
input {
animation: blink-empty 1s infinite;
border-left: transparent solid 1px;
margin:5px
}
@keyframes blink-empty {
50% {border-left: 1px solid #333;}
}
</style></head>
<body>
<input type="text" value="" id="Box1"/>
<script type="text/javascript">
window.onload = function() {
document.getElementById("Box1").focus();
document.getElementById("Box1").value= ("Text in the textbox");
};
</script>
</body>
</html>
我希望逐个字符地显示“文本框中的文本”值，就好像用户正在输入一样，每个字符之间有一些时间。所以我的问题是有人知道在 js 中进行计时和附加列表的方法吗？谢谢!
最佳答案
您可以使用 setTimeout并排队将字符写入文本框。
window.onload = function() {
var box = document.getElementById("Box1"),
text = "Text in the textbox";
document.getElementById("Box1").focus();
for (var i = 0, l = text.length; i < l; i++) {
setTimeout(function(i) {
box.value = text.substring(0, i + 1);
}.bind(this, i), i * 200);
}
};
关于javascript - 如何逐字符显示文本框中的文本？，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/24870804/