javascript写的一个模拟阅读小说的程序


Posted in Javascript onApril 04, 2014
<html> 
<meta http-equiv="content-type" content="text/html; charset=UTF-8" /> 
<head> 
<title></title> 
<script type="text/javascript"> 
function Reader(content, cID, stopID, continueID) { 
this.conLoad = document.getElementById(cID); 
this.stopBtn = document.getElementById(stopID); 
this.continueBtn = document.getElementById(continueID); 
this.content = content; 
this.index = 0; 
var t = this; 
this.stopBtn.onclick = ( 
function () { 
return function () { 
t.stopReader(t); 
}; 
})(t); 
this.continueBtn.onclick = ( 
function () { 
return function () { 
t.continueReader(t); 
}; 
})(t); 
} 
Reader.prototype = { 
startReader : function () { 
var t = this; 
t.toId = setInterval(function () { 
if (t.content[t.index]) { 
t.conLoad.innerHTML += t.content[t.index]; 
} 
t.index++; 
if (t.content.length == t.index) { 
clearInterval(t.toId); 
t.conLoad.innerHTML += "【未完待续】"; 
} 
}, 200); 
}, 
stopReader : function (t) { 
t.flag = true; 
clearInterval(t.toId); 
}, 
continueReader : function (t) { 
if (t.flag) 
t.startReader(); 
t.flag = false; 
} 
}; 
var content = "蒙古亲王僧格林沁?G悍勇猛,他率领的军队向来号称能征惯战,八旗兵、绿营他都看不上眼,更何况那些临时招募的练勇。可偏偏就是这些他眼中的乌合之众,这些年来在江南战果累累,最终攻下了江宁,夺得了对太平军作战的全胜。" + 
"相反地,他的蒙古铁骑在与捻军的角逐中常常打败仗,相形之下,昔日的声威锐减。这个一代天骄的后裔,对曾氏兄弟和湘军窝着一肚皮无名怒火。" + 
 "湘军进江宁后,打劫财富,屠城纵火,又放走幼天王,朝野谤?四起,物议沸腾,僧格林沁听了十分得意,赶紧打发富明阿以视察满城为由,去江宁实地了解。谁料曾国荃一吓一贿征服了富明阿,江宁将军回去后向僧格林沁作了假汇报。"; 
//页面加载完成之后执行。 
window.onload = function () { 
new Reader(content, "content", "btnStop", "btnContinue").startReader(); 
}; 
</script> 
<body> 
<div id='content'></div> 
<div id='operate'><input type='button' id='btnStop' value='stop'/><input type='button' id='btnContinue' value='continue'/></div> 
</body> 
</html>
Javascript 相关文章推荐
CodeMirror2 IE7/IE8 下面未知运行时错误的解决方法
Mar 29 Javascript
JavaScript语言核心数据类型和变量使用介绍
Aug 23 Javascript
jquery中的查找parents与closest方法之间的区别
Dec 02 Javascript
全面解析Javascript无限添加QQ好友原理
Jun 15 Javascript
JS实现控制文本框的内容
Jul 10 Javascript
Bootstrap整体框架之CSS12栅格系统
Dec 15 Javascript
JS实现超简单的汉字转拼音功能示例
Dec 22 Javascript
bootstrap datetimepicker日期插件使用方法
Jan 13 Javascript
Angular如何引入第三方库的方法详解
Jul 13 Javascript
浅谈JavaScript中的属性:如何遍历属性
Sep 14 Javascript
vue中typescript装饰器的使用方法超实用教程
Jun 17 Javascript
three.js利用gpu选取物体并计算交点位置的方法示例
Nov 25 Javascript
js 显示base64编码的二进制流网页图片
Apr 04 #Javascript
jquery scroll()区分横向纵向滚动条的方法
Apr 04 #Javascript
jQuery scroll事件实现监控滚动条分页示例
Apr 04 #Javascript
javascript移出节点removeChild()使用介绍
Apr 03 #Javascript
javascript 拷贝节点cloneNode()使用介绍
Apr 03 #Javascript
javascript替换已有元素replaceChild()使用介绍
Apr 03 #Javascript
Extjs grid添加一个图片状态或者按钮的方法
Apr 03 #Javascript
You might like
PHP静态新闻列表自动生成代码
2007/06/14 PHP
thinkPHP中钩子的两种配置调用方法详解
2016/11/11 PHP
Laravel关系模型指定条件查询方法
2019/10/10 PHP
Thinkphp5.0 框架实现控制器向视图view赋值及视图view取值操作示例
2019/10/12 PHP
延时重复执行函数 lLoopRun.js
2007/05/08 Javascript
Jquery优化效率 提升性能解决方案
2010/09/06 Javascript
JS拖动技术 关于setCapture使用
2010/12/09 Javascript
再说AutoComplete自动补全之实现原理
2011/11/05 Javascript
JavaScript实现彩虹文字效果的方法
2015/04/16 Javascript
javascript三元运算符用法实例
2015/04/16 Javascript
jQuery控制控件文本的长度的操作方法
2016/12/05 Javascript
详解webpack+es6+angular1.x项目构建
2017/05/02 Javascript
结合Vue控制字符和字节的显示个数的示例
2018/05/17 Javascript
详解JS函数stack size计算方法
2018/06/18 Javascript
继承行为在 ES5 与 ES6 中的区别详解
2019/12/24 Javascript
详解React中共享组件逻辑的三种方式
2021/02/02 Javascript
[33:23]VG vs Pain 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
pycharm 使用心得(六)进行简单的数据库管理
2014/06/06 Python
Python+matplotlib+numpy绘制精美的条形统计图
2018/01/02 Python
利用Python yagmail三行代码实现发送邮件
2018/05/11 Python
python 限制函数执行时间,自己实现timeout的实例
2019/01/12 Python
Python递归求出列表(包括列表中的子列表)的最大值实例
2020/02/27 Python
用python获取txt文件中关键字的数量
2020/12/24 Python
几个MySql的面试题
2013/04/22 面试题
精彩的英文自荐信
2014/01/30 职场文书
优秀团员自我评价范文
2014/04/23 职场文书
《改造我们的学习》心得体会
2014/11/07 职场文书
2014年世界艾滋病日演讲稿
2014/11/28 职场文书
采购员岗位职责范本
2015/04/07 职场文书
文员岗位职责范本
2015/04/16 职场文书
2015年学生管理工作总结
2015/05/26 职场文书
2016应届毕业生实习心得体会
2015/10/09 职场文书
学生检讨书范文
2019/06/24 职场文书
JavaScript canvas实现流星特效
2021/05/20 Javascript
企业版Windows 11有哪些新功能? Win11适用于企业的功能介绍
2021/11/21 数码科技
Pandas 数据编码的十种方法
2022/04/20 Python