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 window对象的top、parent、opener含义介绍
Dec 03 Javascript
jquery遍历筛选数组的几种方法和遍历解析json对象
Dec 13 Javascript
JavaScript DOM事件(笔记)
Apr 08 Javascript
JS实现CheckBox复选框全选全不选功能
May 06 Javascript
点评js异步加载的4种方式
Dec 22 Javascript
BootstrapTable请求数据时设置超时(timeout)的方法
Jan 22 Javascript
利用Node.js编写跨平台的spawn语句详解
Feb 12 Javascript
微信小程序之获取当前位置经纬度以及地图显示详解
May 09 Javascript
分析javascript原型及原型链
Mar 18 Javascript
angular4强制刷新视图的方法
Oct 09 Javascript
js表达式与运算符简单操作示例
Feb 15 Javascript
vue登录页实现使用cookie记住7天密码功能的方法
Feb 18 Vue.js
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教程 预定义变量
2009/10/23 PHP
php 获取select下拉列表框的值
2010/05/08 PHP
php使用cookie保存用户登录的用户名实例
2015/01/26 PHP
php对象和数组相互转换的方法
2015/05/12 PHP
jQuery 各种浏览器下获得日期区别
2008/12/22 Javascript
初识javascript 文档碎片
2010/07/13 Javascript
document.compatMode的CSS1compat使用介绍
2014/04/03 Javascript
Javascript获取当前日期的农历日期代码
2014/10/08 Javascript
EasyUi中的Combogrid 实现分页和动态搜索远程数据
2016/04/01 Javascript
微信小程序-getUserInfo回调的实例详解
2017/10/27 Javascript
JS实现验证码倒计时的注册页面
2018/01/02 Javascript
详解node.js中的npm和webpack配置方法
2018/01/21 Javascript
Angular6中使用Swiper的方法示例
2018/07/09 Javascript
vue2.x 通过后端接口代理,获取qq音乐api的数据示例
2019/10/30 Javascript
JS 5种遍历对象的方式
2020/06/16 Javascript
Element-ui upload上传文件限制的解决方法
2021/01/22 Javascript
收集的几个Python小技巧分享
2014/11/22 Python
python pandas修改列属性的方法详解
2018/06/09 Python
Python操作MySQL数据库的两种方式实例分析【pymysql和pandas】
2019/03/18 Python
python画双y轴图像的示例代码
2019/07/07 Python
Python Gitlab Api 使用方法
2019/08/28 Python
python多进程(加入进程池)操作常见案例
2019/10/21 Python
详解mac python+selenium+Chrome 简单案例
2019/11/08 Python
解决pyCharm中 module 调用失败的问题
2020/02/12 Python
Python动态导入模块和反射机制详解
2020/02/18 Python
python生成xml时规定dtd实例方法
2020/09/21 Python
Django创建一个后台的基本步骤记录
2020/10/02 Python
Python APScheduler执行使用方法详解
2020/12/10 Python
HTML5中canvas中的beginPath()和closePath()的重要性
2018/08/24 HTML / CSS
新西兰最大、占有率最高的综合性药房:PharmacyDirect药房中文网
2020/11/03 全球购物
最新个人职业生涯规划书
2014/01/22 职场文书
计算机应用专业毕业生求职信
2014/06/03 职场文书
大学生学雷锋活动总结
2014/06/26 职场文书
电子专业自荐信
2014/07/01 职场文书
2015年保险公司内勤工作总结
2015/05/23 职场文书
结婚幸福感言
2015/08/01 职场文书