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 相关文章推荐
js创建对象的几种常用方式小结(推荐)
Oct 24 Javascript
js中数组(Array)的排序(sort)注意事项说明
Jan 24 Javascript
jquery解析xml字符串示例分享
Mar 25 Javascript
js跨域问题浅析及解决方法优缺点对比
Nov 08 Javascript
JS面向对象编程详解
Mar 06 Javascript
jquery按回车键实现表单提交的简单实例
May 25 Javascript
JavaScript实现in-place思想的快速排序方法
Aug 07 Javascript
如何理解Vue的render函数的具体用法
Aug 30 Javascript
详解关于Angular4 ng-zorro使用过程中遇到的问题
Dec 05 Javascript
vue el-tree 默认展开第一个节点的实现代码
May 15 Javascript
详解javascript void(0)
Jul 13 Javascript
一起来了解一下JavaScript的预编译(小结)
Mar 01 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 和 MySQL 基础教程(一)
2006/10/09 PHP
PHP生成带有雪花背景的验证码
2008/09/28 PHP
php xml实例 留言本
2009/03/20 PHP
PHP7新特性之抽象语法树(AST)带来的变化详解
2018/07/17 PHP
PHP设计模式之委托模式定义与用法简单示例
2018/08/13 PHP
关于Laravel参数验证的一些疑与惑
2019/11/19 PHP
js实现GridView单选效果自动设置交替行、选中行、鼠标移动行背景色
2010/05/27 Javascript
JS对外部文件的加载及对IFRMAME的加载的实现,当加载完成后,指定指向方法(方法回调)
2011/07/04 Javascript
jQuery操作表格(table)的常用方法、技巧汇总
2014/04/12 Javascript
JavaScript随机生成信用卡卡号的方法
2015/04/07 Javascript
浅析AngularJS中的生命周期和延迟处理
2015/06/18 Javascript
JS取模、取商及取整运算方法示例
2016/10/13 Javascript
在JSP中如何实现MD5加密的方法
2016/11/02 Javascript
基于Three.js插件制作360度全景图
2016/11/29 Javascript
AngularJS路由切换实现方法分析
2017/03/17 Javascript
解决html-jquery/js引用外部图片时遇到看不了或出现403的问题
2017/09/22 jQuery
VUE饿了么树形控件添加增删改功能的示例代码
2017/10/17 Javascript
vue通过点击事件读取音频文件的方法
2018/05/30 Javascript
Element-UI踩坑之Pagination组件的使用
2018/10/29 Javascript
基于layui table返回的值的多级嵌套的解决方法
2019/09/19 Javascript
[42:35]2018DOTA2亚洲邀请赛3月30日 小组赛A组 VG VS OpTic
2018/03/31 DOTA
Python常见文件操作的函数示例代码
2011/11/15 Python
python实现360皮肤按钮控件示例
2014/02/21 Python
Python网络爬虫实例讲解
2016/04/28 Python
Python实现的读写json文件功能示例
2018/06/05 Python
详谈Pandas中iloc和loc以及ix的区别
2018/06/08 Python
python flask实现分页的示例代码
2018/08/02 Python
python处理大日志文件
2019/07/23 Python
LEGO玩具英国官方商店:LEGO Shop GB
2018/03/27 全球购物
全球领先的在线cosplay服装商店:RoleCosplay
2020/01/18 全球购物
Nike瑞士官网:Nike CH
2021/01/18 全球购物
商务英语本科生的自我评价分享
2013/11/15 职场文书
初中考试作弊检讨书
2014/02/01 职场文书
写景作文评语集锦
2014/12/25 职场文书
党员违纪检讨书
2015/05/05 职场文书
志愿服务心得体会
2016/01/15 职场文书