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 相关文章推荐
asp 取文本框名称代码
Dec 02 Javascript
jquery css 设置table的奇偶行背景色示例
Jun 03 Javascript
javascript控制台详解
Jun 25 Javascript
JS禁止查看网页源代码的实现方法
Oct 12 Javascript
javascript跨域请求包装函数与用法示例
Nov 03 Javascript
vue2.0$nextTick监听数据渲染完成之后的回调函数方法
Sep 11 Javascript
在vue项目中使用md5加密的方法
Sep 14 Javascript
详解vue-cli 3.0 build包太大导致首屏过长的解决方案
Nov 10 Javascript
巧妙运用v-model实现父子组件传值的方法示例
Apr 07 Javascript
javascript数据类型中的一些小知识点(推荐)
Apr 18 Javascript
JS回调函数 callback的理解与使用案例分析
Sep 09 Javascript
Echarts.js无法引入问题解决方案
Oct 30 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
QueryPath PHP 中的jQuery
2010/04/11 PHP
PHP处理会话函数大总结
2015/08/05 PHP
必须收藏的23个php实用代码片段
2016/02/02 PHP
PHP处理CSV表格文件的常用操作方法总结
2016/07/01 PHP
PHP实现模拟http请求的方法分析
2017/12/20 PHP
jQuery 自定义函数写法分享
2012/03/30 Javascript
jQuery 获取URL的GET参数值的小例子
2013/04/18 Javascript
JS控制文本框textarea输入字数限制的方法
2013/06/17 Javascript
js获取html文件的思路及示例
2013/09/17 Javascript
appendChild() 或 insertBefore()使用与区别介绍
2013/10/11 Javascript
JS判断变量是否为空判断是否null
2014/07/25 Javascript
浅析$.getJSON异步请求和同步请求
2016/06/06 Javascript
简单谈谈CommonsChunkPlugin抽取公共模块
2017/12/31 Javascript
AngularJS自定义过滤器用法经典实例总结
2018/05/17 Javascript
微信小程序动态生成二维码的实现代码
2018/07/25 Javascript
gulp构建小程序的方法步骤
2019/05/31 Javascript
Python实现二分查找算法实例
2015/05/26 Python
Python QQBot库的QQ聊天机器人
2019/06/19 Python
Pytorch损失函数nn.NLLLoss2d()用法说明
2020/07/07 Python
HTML5 Plus 实现手机APP拍照或相册选择图片上传功能
2016/07/13 HTML / CSS
使用css如何制作时间ICON方法实践
2012/11/12 HTML / CSS
基于HTML5 的人脸识别活体认证的实现方法
2016/06/22 HTML / CSS
Pretty Little Thing爱尔兰:时尚女性服饰
2017/03/27 全球购物
《难忘的泼水节》教学反思
2014/02/27 职场文书
现金出纳岗位职责
2014/03/15 职场文书
护士自我鉴定总结
2014/03/24 职场文书
企业年度评优方案
2014/06/02 职场文书
办理房产证委托书
2014/09/18 职场文书
个人作风建设剖析材料
2014/10/11 职场文书
司法局2014法制宣传日活动总结
2014/11/01 职场文书
打架检讨书范文
2015/01/27 职场文书
接待员岗位职责范本
2015/04/15 职场文书
二胎满月酒致辞
2015/07/29 职场文书
公司晚会主持词
2019/04/17 职场文书
CSS font-variation 可变字体的魅力(实例详解)
2022/03/03 HTML / CSS
Springboot中如何自动转JSON输出
2022/06/16 Java/Android