2012-10-22 来源:网络
【实例名称】
类似安装效果的textarea滚动
【实例描述】
现在使用Microsoft提供的Install工具,都是向导形式的安装,但一些比较底层的工具安装,通常会使用类似DOS中的BAT批处理效果。本例学习如何通过textarea的滚动,实现这种效果。
【实例代码】
<html xmlns="http://www.w3.org/1999/xhtml" > <head> <title>标题页</title> </head> <body> <textarea id="install" cols=20 rows=10 style="background-color:Black; color:White;"></textarea> <script> var tmpStr = ""; for(var i = 0;i< 26;i++) { for(var j=0;j<=i;j++) //遍历26个英文字母 { tmpStr += String.fromCharCode(65+i);//连接要显示的字符串 } tmpStr += "......\r\n"; //行结束符号 } var arr = tmpStr.split("\r\n"); //将字符串切割成数组 function addLine(line) { if(line >= arr.length) return; var txtOb = document.getElementById("install"); //获取TextArea控件 txtOb.value += arr[line] + "\r\n"; //每局输出后都要求换行 if(txtOb.clientHeight <= txtOb.scrollHeight) txtOb.scrollTop = txtOb.scrollHeight - txtOb.clientHeight; setTimeout("addLine(" + (line+1) + ")",500); } setTimeout("addLine(0)",1); </script></body>
</body> </html>
【运行效果】
【难点剖析】
本洌的重点有两个:循环输出26个英文字母,以及逐行输出的设计原理。输出26个英文字母。是通过字符串对象的“fromCharCode”方法,其中“65”是大写字母“A”的unlcode编码。逐行输出使用的是换行符“\r\n”。
【源码下载】
相关文章