html逐字显示后静止,逐字展示，并使用callback显示下一行

逐字显示，并使用callback显示下一行

HTML结构：

JS实现：

/* lines words */

var w1 = '时光是琥珀',

w2 = '泪一滴滴被反锁'

w3='情书再不朽',

w4='也磨成沙漏',

w5='青春的上游',

w6='白云飞走苍狗与海鸥',

w7='闪过的念头',

w8='潺潺的溜走';

/* show page 1 words */

showWord(w1,document.getElementById('w1'),0,function(){

showWord(w2,document.getElementById('w2'),0,null);

});

/* show function */

function showWord(word,objID,i,callback){

var wlen = word.length;

objID.innerHTML += word[i];

i++;

setTimeout(function(){

if(i < wlen) {

showWord(word, objID, i, callback);

}else if(i == wlen){

callback();

}

},300);

}

上面的功能就是逐行逐字显示文字，当显示完一条之后，要显示的下一句话可以通过callback来确定。