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 相关文章推荐
JavaScript使用focus()设置焦点失败的解决方法
Sep 03 Javascript
JavaScript ES5标准中新增的Array方法
Jun 28 Javascript
BootStrap Table 分页后重新搜索问题的解决办法
Aug 08 Javascript
canvas实现十二星座星空图
Feb 14 Javascript
Vue.js实现多条件筛选、搜索、排序及分页的表格功能
Nov 24 Javascript
ES6教程之for循环和Map,Set用法分析
Apr 10 Javascript
vue实现移动端图片裁剪上传功能
Aug 18 Javascript
jQueryMobile之窗体长内容的缺陷与解决方法实例分析
Sep 20 jQuery
ng-alain表单使用方式详解
Jul 10 Javascript
微信小程序生成二维码的示例代码
Mar 29 Javascript
vuex刷新后数据丢失的解决方法
Oct 18 Javascript
JavaScript实现复选框全选功能
Apr 11 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
中国第一家无线电行
2021/03/01 无线电
解析zend Framework如何自动加载类
2013/06/28 PHP
php中ob_flush函数和flush函数用法分析
2015/03/18 PHP
PHP输出缓冲控制Output Control系列函数详解
2015/07/02 PHP
php实现简单的MVC框架实例
2015/09/23 PHP
smarty高级特性之对象的使用方法
2015/12/25 PHP
jQuery 顺便学习下CSS选择器 奇偶匹配nth-child(even)
2010/05/24 Javascript
in.js 一个轻量级的JavaScript颗粒化模块加载和依赖关系管理解决方案
2011/07/26 Javascript
Jquery Uploadify多文件上传带进度条且传递自己的参数
2013/08/28 Javascript
jquery实现简单手风琴菜单效果实例
2015/06/13 Javascript
jquery实现通用的内容渐显Tab选项卡效果
2015/09/07 Javascript
使用javaScript动态加载Js文件和Css文件
2015/10/24 Javascript
JavaScript中的跨浏览器事件操作的基本方法整理
2016/05/20 Javascript
前端框架Vue.js中Directive知识详解
2016/09/12 Javascript
浅析jQuery操作select控件的取值和设值
2016/12/07 Javascript
javascript实现将数字转成千分位的方法小结【5种方式】
2016/12/11 Javascript
angular实现表单验证及提交功能
2017/02/01 Javascript
svg动画之动态描边效果
2017/02/22 Javascript
Python 解析XML文件
2009/04/15 Python
简单说明Python中的装饰器的用法
2015/04/24 Python
python的Crypto模块实现AES加密实例代码
2018/01/22 Python
使用python存储网页上的图片实例
2018/05/22 Python
jupyter notebook 中输出pyecharts图实例
2020/04/23 Python
django中使用Celery 布式任务队列过程详解
2019/07/29 Python
python opencv图片编码为h264文件的实例
2019/12/12 Python
Python将列表中的元素转化为数字并排序的示例
2019/12/25 Python
纯css3无js实现的Android Logo(有简单动画)
2013/01/21 HTML / CSS
HTML5拖拽文件上传的示例代码
2021/03/04 HTML / CSS
斯巴达比赛商店:Spartan Race
2019/01/08 全球购物
英国外籍人士的在线超市:British Corner Shop
2019/06/03 全球购物
如何实现jdbc性能优化
2012/07/30 面试题
秘书专业自荐信范文
2013/12/26 职场文书
小学评语大全
2014/04/22 职场文书
发布会邀请函
2015/01/31 职场文书
2016年寒假生活小结
2015/10/10 职场文书
如何使用flask将模型部署为服务
2021/05/13 Python