javascript寫的一個模擬閱讀小說的程序
更新時間:2014年04月04日 11:14:14 作者:
這篇文章主要介紹了用javascript寫了一個模擬閱讀小說的程序,需要的朋友可以參考下
復(fù)制代碼 代碼如下:
<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 += "【未完待續(xù)】";
}
}, 200);
},
stopReader : function (t) {
t.flag = true;
clearInterval(t.toId);
},
continueReader : function (t) {
if (t.flag)
t.startReader();
t.flag = false;
}
};
var content = "蒙古親王僧格林沁慓悍勇猛,他率領(lǐng)的軍隊(duì)向來號稱能征慣戰(zhàn),八旗兵、綠營他都看不上眼,更何況那些臨時招募的練勇。可偏偏就是這些他眼中的烏合之眾,這些年來在江南戰(zhàn)果累累,最終攻下了江寧,奪得了對太平軍作戰(zhàn)的全勝。" +
"相反地,他的蒙古鐵騎在與捻軍的角逐中常常打敗仗,相形之下,昔日的聲威銳減。這個一代天驕的后裔,對曾氏兄弟和湘軍窩著一肚皮無名怒火。" +
"湘軍進(jìn)江寧后,打劫財富,屠城縱火,又放走幼天王,朝野謗讟?biāo)钠穑镒h沸騰,僧格林沁聽了十分得意,趕緊打發(fā)富明阿以視察滿城為由,去江寧實(shí)地了解。誰料曾國荃一嚇一賄征服了富明阿,江寧將軍回去后向僧格林沁作了假匯報。";
//頁面加載完成之后執(zhí)行。
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>
相關(guān)文章
vue3中Element Plus全局組件配置中文的兩種方案
element-plus組件文字語言默認(rèn)是英文,需要手動更改一下中文包 ,本文主要介紹了vue3中Element Plus全局組件配置中文的兩種方案,具有一定的參考價值,感興趣的可以了解一下2023-12-12js設(shè)置文本框中焦點(diǎn)位置在最后的示例代碼(簡單實(shí)用)
本篇文章主要是對js設(shè)置文本框中焦點(diǎn)位置在最后的示例代碼進(jìn)行了介紹,需要的朋友可以過來參考下,希望對大家有所幫助2014-03-03JS正則表達(dá)式修飾符中multiline(/m)用法分析
這篇文章主要介紹了JS正則表達(dá)式修飾符中multiline(/m)用法,結(jié)合實(shí)例形式分析了JS正則中多行模式multiline的功能、使用方法與相關(guān)注意事項(xiàng),需要的朋友可以參考下2016-12-12淺談Javascript中的12種DOM節(jié)點(diǎn)類型
DOM是javascript操作網(wǎng)頁的接口,全稱為文檔對象模型(Document Object Model)。本文將主要說明DOM節(jié)點(diǎn)類型,有需要的可以參考借鑒。2016-08-08uniapp路由uni-simple-router實(shí)例詳解
uni-simple-router專為uniapp打造的路由器,和uniapp深度集成,這篇文章主要給大家介紹了關(guān)于uniapp路由uni-simple-router的相關(guān)資料,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下2022-09-09bootstrap Table服務(wù)端處理分頁(后臺是.net)
這篇文章主要為大家詳細(xì)介紹了bootstrap Table服務(wù)端處理分頁,后臺是.net,具有一定的參考價值,感興趣的小伙伴們可以參考一下2017-10-10