Проблема с выводом.
NextIter: function() {
this.TextIn.innerHTML = '';
if (this.Iter == this.endIter) { this.End(); };
for (var abc in this.textArr[this.Iter]) {
this.Write(this.textArr[this.Iter][abc]);//Должен вывести 1 знак из строки
console.log(this.textArr[this.Iter][abc]);
sleep(100);//Работает правильно, функция отдельно
};
this.Iter++;
},
Write: function(letter) {
this.TextIn.innerHTML += letter;
}
В идеале - должен выводить предложение по 1 знаку в 100мс, и в консоли так и есть. Однако текст на самой странице не обновляется, пока не закончится цикл for. Как это решить? |
SecretBabka,
Попробуйте поменять местами функции NextIter и Write (а вообще трудно сказать, не видя полного текста) |
Dilettante_Pro, oт перемены мест слагаемых, как говорится.
Если есть пара минут на чтение, напишите мне вк id330113396 |
SecretBabka,
От перемены мест зависит определенность функций в момент исполнения - я же и говорю, что трудно судить, не видя полный текст. В вк не состою, со временем туго Вообще функции, используемые в других функциях, лучше размещать раньше |
Dilettante_Pro,
Всё это дело находится в классе, вот в более понятном виде, результат тот же: В чистом html
<div id="text"></div>
<script>
var TextIn = document.getElementById("text");
var Iter = 0;
var textArr = ["Bla-Bla","Abl-Abl"];
function sleep(ms) {
ms += new Date().getTime();
while (new Date() < ms){}
};
function Write (letter) {
TextIn.innerHTML += letter;
};
function NextIter() {
TextIn.innerHTML = '';//Обнуляем текстовое поле
for (var abc in textArr[Iter]) {
Write(textArr[Iter][abc]);//Выводим по 1 букве каждые 100мс
sleep(100);
};
Iter++;
};
</script>
Как вариант - пробовал не просто писать текст в div, а создавать для каждой буквы span, и открыл окно разработчика(Chrome). В итоге создаётся span во время цикла, но на самой странице отображается _после_ цикла. |
Цитата:
тогда даже for не нужен будет, для выполнения вашей задачи ... увидите setInterval закройте закройте глаза и пропустите текст, :) вам нужен только setTimeout |
печатная машинка 2016
SecretBabka, :)
<!DOCTYPE HTML>
<html>
<head>
<title>Untitled</title>
<meta charset="utf-8">
</head>
<body>
<div></div>
<script>
function typeText(d, g, h, e) {
var a, b, f = performance.now();
requestAnimationFrame(function k(c) {
if (!b || !b.length)
if (b = g.shift()) a = document.createElement("br"), d.appendChild(a), a = document.createTextNode(""), d.appendChild(a), b = b.split("");
else {
e && e();
return
}
c = (c - f) / h;
1 < c && (c = 1);
1 == c && (f = performance.now(), a.data += b.shift());
requestAnimationFrame(k)
})
};
var div = document.getElementsByTagName("div")[0];
typeText(div, ["ololo ololo lololo lolo","всяка фигня","Вы прочитали это важное сообщение"], 100, function() {
alert("УРА!!!");
});
</script>
</body>
</html>
|
рони,
Функцию sleep() я задал выше, и она корректно работает сама по себе. Но спасибо, пришлось во многом поменять код, с интервалом работает. |
Цитата:
|
| Часовой пояс GMT +3, время: 01:28. |