<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 = "蒙古亲王僧格林沁慓悍勇猛，他率领的军队向来号称能征惯战，八旗兵、绿营他都看不上眼，更何况那些临时招募的练勇。可偏偏就是这些他眼中的乌合之众，这些年来在江南战果累累，最终攻下了江宁，夺得了对太平军作战的全胜。" +

    "相反地，他的蒙古铁骑在与捻军的角逐中常常打败仗，相形之下，昔日的声威锐减。这个一代天骄的后裔，对曾氏兄弟和湘军窝着一肚皮无名怒火。" +

    　　 "湘军进江宁后，打劫财富，屠城纵火，又放走幼天王，朝野谤讟四起，物议沸腾，僧格林沁听了十分得意，赶紧打发富明阿以视察满城为由，去江宁实地了解。谁料曾国荃一吓一贿征服了富明阿，江宁将军回去后向僧格林沁作了假汇报。";

//页面加载完成之后执行。

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写了一个模拟阅读小说的程序的更多相关文章

  1. JavaScript写的一个带AI的井字棋

    最近有一门课结束了,需要做一个井字棋的游戏,我用JavaScript写了一个.首先界面应该问题不大,用html稍微写一下就可以.主要是人机对弈时的ai算法,如何使电脑方聪明起来,是值得思考一下的.开始 ...

  2. Javascript写的一个可拖拽排序的列表

    自己常试写了一个可拖拽进行自定义排序的列表,可能写的不太好,欢迎提供意见. 我的思路是将列表中的所有项都放进一个包裹层,将该包裹层设为相对定位,每当点击一个项时,将该项脱离文档并克隆一份重新添加到文档 ...

  3. Javascript写了一个2048的游戏

    去年2048很火, 本来我也没玩过, 同事说如果用JS写 只要100多行代码: PS(iWeb峰会暨攻城师嘉年华2015嘉年华要来啦, 在文章结尾有具体的地址和时间): 今天试了一下, 逻辑也不复杂, ...

  4. 闲来无事，用javascript写了一个简单的轨迹动画

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  5. 一个模拟"显示桌面.scf"程序的JS小函数

    有时候我们或许有这样的一个需求,用JS模拟这样一个动作,同时按下组合快捷键:Windows旗帜键+D键,下面这个函数就可以帮到我们了. function f_ToggleDesktop() { var ...

  6. 用Go写了一个相似Proxy的小程序,能够用来訪问goolge个人使用还是能够的.

    package main import ( "fmt" "io" "net/http" ) func main() { http.Handl ...

  7. JavaScript写一个连连看的游戏

    天天看到别人玩连连看, 表示没有认真玩过, 不就把两个一样的图片连接在一起么, 我自己写一个都可以呢. 使用Javascript写了一个, 托管到github, 在线DEMO地址查看:打开 最终的效果 ...

  8. 今天写了一个简单的新浪新闻RSS操作类库

    今天,有位群友问我如何获新浪新闻列表相关问题,我想,用正则表达式网页中取显然既复杂又不一定准确,现在许多大型网站都有RSS集合,所以我就跟他说用RSS应该好办一些. 一年前我写过一个RSS阅读器,不过 ...

  9. 写了一个hiero中添加自定义Token的脚本

    Hiero自带Token往往不够用,shotname中自带版本号的情况下要升级版本会很麻烦,比如Shot_0001_v001这样一个序列名,要升级为Shot_0001_v002就必须把_v001之前的 ...

随机推荐

  1. Nacos 知识点

    Nacos 名字的由来(取红色的英文字符): Dynamic Naming and Configuration Service Nacos 是 Spring Cloud Alibaba 的一个组件,详 ...

  2. day8_7.8 文件操作

    一.文件模式 1.在文件的操作中,也有很多补充 的模式可使用 1.r+,可读可写模式,在此模式中,操作权限时可读可写,这里的写与write模式不一样的是,不再清空文件内容,写的内容添加到文件的后面,而 ...

  3. VMware10新建虚拟机

    1. 新建虚拟机 2. 选择 “典型(推荐)(T)” 安装 3. “稍后安装操作系统”,创建一个空白硬盘 4. 选择 “Linux” 的 “CentOS 64位” 5. 设置 “虚拟机名称” 和 “位 ...

  4. LeetCode 153. Find Minimum in Rotated Sorted Array寻找旋转排序数组中的最小值 (C++)

    题目: Suppose an array sorted in ascending order is rotated at some pivot unknown to you beforehand. ( ...

  5. springboot2.1+redis多数据源的配置

    springboot系列学习笔记全部文章请移步值博主专栏**: spring boot 2.X/spring cloud Greenwich.    由于是一系列文章,所以后面的文章可能会使用到前面文 ...

  6. Ultimate Chicken Horse GameProject第二次迭代成果文档

    基于上一次的迭代中的数据结构我们补充了UML图.用例图及状态图. 用例图:           选择游戏地图:玩家可以在本地游戏界面将角色移动到地图门口并按下E进入地图. 进行游戏用例: 选择并摆放道 ...

  7. myeclipse开发工具的简单使用

    一.使用eclipse.myeclipse开发JAVA程序 将程序开发环境和调试环境集合在一起,提高开发效率 1.创建java项目2.创建程序包3.编写JAVA源程序4.运行JAVA程序 二.程序移植 ...

  8. flask 搭建简单restful接口，moco基础

    from flask import Flask, jsonify, abort, make_response app = Flask(__name__)app.config['JSON_AS_ASCI ...

  9. web服务器获取请求客户端真实地址的方法

    服务器获取客户端或者网页的请求,获取IP时需要注意,因为一个请求到达服务器之前,一般都会经过一层或者多层代理服务器,比如反向代理服务器将http://192.168.1.10:port/ 的URL反向 ...

  10. C++中整型变量的存储大小和范围

    一.代码查看 #include <iostream> #include <climits> using namespace std; int main(void) { cout ...