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 相关文章推荐
解决FLASH需要点击激活的代码
Dec 20 Javascript
使用javascript将时间转换成今天,昨天,前天等格式
Jun 25 Javascript
jQuery代码实现发展历程时间轴特效
Jul 30 Javascript
jQuery简单实现两级下拉菜单效果代码
Sep 15 Javascript
jQuery滚动插件scrollable.js用法分析
May 25 jQuery
关于在vue-cli中使用微信自动登录和分享的实例
Jun 22 Javascript
Angular.js组件之input mask对input输入进行格式化详解
Jul 10 Javascript
浅谈mint-ui loadmore组件注意的问题
Nov 08 Javascript
浅谈基于Vue.js的移动组件库cube-ui
Dec 20 Javascript
jQuery HTML获取内容和属性操作实例分析
May 20 jQuery
解决vue刷新页面以后丢失store的数据问题
Aug 11 Javascript
原生JS实现九宫格抽奖
Sep 13 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类声明和php类使用方法示例分享
2014/03/29 PHP
php简单实现MVC
2015/02/05 PHP
基于jquery实现的服务器验证控件的启用和禁用代码
2010/04/27 Javascript
js获取多个tagname的节点数组
2013/09/22 Javascript
javascript中attribute和property的区别详解
2014/06/05 Javascript
深入探寻javascript定时器
2015/01/02 Javascript
js获得当前系统日期时间的方法
2015/05/06 Javascript
解析javascript中鼠标滚轮事件
2015/05/26 Javascript
jQuery ajax分页插件实例代码
2016/01/27 Javascript
Bootstrap 粘页脚效果
2016/03/28 Javascript
基于JavaScript实现轮播图代码
2016/07/14 Javascript
js获取当前时间(昨天、今天、明天)
2016/11/23 Javascript
three.js快速入门【推荐】
2017/01/21 Javascript
vue.js声明式渲染和条件与循环基础知识
2017/07/31 Javascript
react-redux中connect的装饰器用法@connect详解
2018/01/13 Javascript
vue 实现左右拖拽元素并且不超过他的父元素的宽度
2018/11/30 Javascript
如何自定义微信小程序tabbar上边框的颜色
2019/07/09 Javascript
vue日历/日程提醒/html5本地缓存功能
2019/09/02 Javascript
基于Vue+Webpack拆分路由文件实现管理
2020/11/16 Javascript
Python比较两个图片相似度的方法
2015/03/13 Python
Python使用Scrapy爬虫框架全站爬取图片并保存本地的实现代码
2018/03/04 Python
Python使用Pickle库实现读写序列操作示例
2018/06/15 Python
python内置函数sorted()用法深入分析
2019/10/08 Python
python中删除某个元素的方法解析
2019/11/05 Python
Python pandas库中的isnull()详解
2019/12/26 Python
pytorch 数据处理:定义自己的数据集合实例
2019/12/31 Python
pytorch 模型的train模式与eval模式实例
2020/02/20 Python
Python urllib库如何添加headers过程解析
2020/10/05 Python
Sisley法国希思黎中国官网:享誉全球的奢华植物美容品牌
2019/06/30 全球购物
请介绍一下WSDL的文档结构
2013/03/17 面试题
应届护士推荐信
2013/11/16 职场文书
行政部经理助理岗位职责
2014/06/15 职场文书
英语课前三分钟演讲稿
2014/08/19 职场文书
2015年学校教科室工作总结
2015/07/20 职场文书
幼儿园家长心得体会
2016/01/21 职场文书
Mysql数据库group by原理详解
2022/07/07 MySQL