Javascript-форум (https://javascript.ru/forum/)
-   Элементы интерфейса (https://javascript.ru/forum/dom-window/)
-   -   Использование setTimeout в анимации вывода текста (https://javascript.ru/forum/dom-window/41254-ispolzovanie-settimeout-v-animacii-vyvoda-teksta.html)

brianosally 05.09.2013 23:51

Использование setTimeout в анимации вывода текста
 
Есть код:
function effect(index1,tN,textString1)
{
//alert(tN.data);
tN.data+=textString1[index1];
}// effect()

function machineTextEffect(textString,textBodyElNode)
{
var textN=document.createTextNode("");
textBodyElNode.appendChild(textN);
//textN.data=new String("");
for(var i=0;i<textString.length;i++)
{
//timerS=window.
setTimeout(function(index1,tN1,s1){effect(index1,t N1,s1);}(i,textN,textString),408);
//window.clearTimeout(timerS);
}
}// machineTextEffect()

Он должен в цикле выводить по символу, в указанное место textBodyElNode, а на деле, используется один раз, и выдает ошибку вроде
Error: useless setTimeout call (missing quotes around argument?)

BaVa 06.09.2013 00:45

я ваш код не очень понял, написал чуть по-другому
<body>
	<div>.</div>
	<script>
		function typeText(elem, text) {
			var i = 0;
			var stop = false;
			var si = setInterval(function() {
				if(text.length === i) clearInterval(si);
				else {
					if(elem.textContent) 
						elem.textContent += text[i];
					else if(elem.innerText) 
						elem.innerText += text[i];
				}
				i++;
			}, 408);
		}
		var div = document.getElementsByTagName("div")[0];
		typeText(div, "ololo ololo lololo lolo");
	</script>
</body>


Поставил в <div> точку, потому что не выводит textContent в пустой div. Подскажите кто-нибудь, почему?

рони 06.09.2013 01:18

BaVa,
потому что строки 10 и 12 непроверяют наличие свойства а проверяют наличие содержания -- а содержание пусто ""

рони 06.09.2013 01:33

BaVa,
<body>
	<div></div>
	<script>
		function typeText(elem, text) {
			var i = 0;
			var stop = false;
			var si = setInterval(function() {
				if(text.length === i) clearInterval(si);
				else {
					if(elem.textContent !== undefined)
						elem.textContent += text[i];
					else if(elem.innerText !== undefined)
						elem.innerText += text[i];
				}
				i++;
			}, 408);
		}
		var div = document.getElementsByTagName("div")[0];
		typeText(div, "ololo ololo lololo lolo");
	</script>
</body>

или так
<body>
	<div></div>
	<script>
		function typeText(elem, text) {
			var i = 0;
			var TextNode = document.createTextNode('');
            elem.appendChild(TextNode);
			var si = setInterval(function() {
				if(text.length === i) clearInterval(si);
				else {
					TextNode.data += text[i]
           			}
				i++;
			}, 408);
		}
		var div = document.getElementsByTagName("div")[0];
		typeText(div, "ololo ololo lololo lolo");
	</script>
</body>

ruslan_mart 06.09.2013 04:54

Цитата:

Сообщение от brianosally
setTimeout(function(index1,tN1,s1){effect(index1,t N1,s1);}(i,textN,textString),408);

Вы первым аргументом выполняете ф-цию и в setTimeout передаётся undefined, поэтому такая ошибка.

BaVa 06.09.2013 10:33

рони,
понял)


Часовой пояс GMT +3, время: 23:35.