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通过元素class名字获取元素集合的具体实现
Jan 06 Javascript
js星星评分效果
Jul 24 Javascript
jquery实现将获取的颜色值转换为十六进制形式的方法
Dec 20 Javascript
js点击列表文字对应该行显示背景颜色的实现代码
Aug 05 Javascript
JavaScript识别网页关键字并进行描红的方法
Nov 09 Javascript
详谈JS中实现种子随机数及作用
Jul 19 Javascript
node.js与C语言 实现遍历文件夹下最大的文件,并输出路径,大小
Jan 20 Javascript
iscroll.js滚动加载实例详解
Jul 18 Javascript
JavaScript的Object.defineProperty详解
Jul 09 Javascript
Vue刷新修改页面中数据的方法
Sep 16 Javascript
webpack HappyPack实战详解
Oct 08 Javascript
基于vue.js仿淘宝收货地址并设置默认地址的案例分析
Aug 20 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 Cookie的使用教程详解
2013/06/03 PHP
PHP批量上传图片的具体实现方法介绍.
2014/02/26 PHP
php获得文件大小和文件创建时间的方法
2015/03/13 PHP
php实现将wav文件转换成图像文件并在页面中显示的方法
2015/04/21 PHP
php编程每天必学之表单验证
2016/03/01 PHP
php添加数据到xml文件的简单例子
2016/09/08 PHP
ThinkPHP5&amp;5.1框架关联模型分页操作示例
2019/08/03 PHP
写了一个layout,拖动条连贯,内容区可为iframe
2007/08/19 Javascript
jQuery .tmpl() 用法示例介绍
2014/08/21 Javascript
javascript实现控制浏览器全屏
2015/03/30 Javascript
JS实现动态修改table及合并单元格的方法示例
2017/02/20 Javascript
Node使用Sequlize连接Mysql报错:Access denied for user ‘xxx’@‘localhost’
2018/01/03 Javascript
vue.js分页中单击页码更换页面内容的方法(配合spring springmvc)
2018/02/10 Javascript
vue-cli 3.0 版本与3.0以下版本在搭建项目时的区别详解
2018/12/11 Javascript
[10:21]2018DOTA2国际邀请赛寻真——Winstrike
2018/08/11 DOTA
python实现图片批量剪切示例
2014/03/25 Python
详细解读Python中解析XML数据的方法
2015/10/15 Python
Python中的descriptor描述器简明使用指南
2016/06/02 Python
python中(str,list,tuple)基础知识汇总
2018/02/20 Python
浅谈pycharm下找不到sqlalchemy的问题
2018/12/03 Python
Python中的单下划线和双下划线使用场景详解
2019/09/09 Python
win10环境下配置vscode python开发环境的教程详解
2019/10/16 Python
使用tensorboard可视化loss和acc的实例
2020/01/21 Python
Python loguru日志库之高效输出控制台日志和日志记录
2020/03/07 Python
python小白切忌乱用表达式
2020/05/29 Python
python中pop()函数的语法与实例
2020/12/01 Python
python 利用matplotlib在3D空间绘制二次抛物面的案例
2021/02/06 Python
原生 JS+CSS+HTML 实现时序图的方法
2019/07/31 HTML / CSS
最新销售员个人自荐信
2013/09/21 职场文书
实习生的自我评价
2014/01/08 职场文书
财务简历的自我评价
2014/03/05 职场文书
采购意向书范本
2014/03/31 职场文书
2014年纪检监察工作总结
2014/11/11 职场文书
党风廉政建设调研报告
2015/01/01 职场文书
分享python函数常见关键字
2022/04/26 Python
CSS 实现磨砂玻璃(毛玻璃)效果样式
2023/05/21 HTML / CSS