简单的原生js打字速度测试代码,示例文字可以自行更换,点击开始打字按钮开始测试,打完点击结束打字按钮,会根据你打完的字数来计算你每分钟打多少字。
js代码
<script type="text/javascript">
function _class(str) {
return document.getElementsByClassName(str);
}
var fontstring = _class("fontString")[0];
var strExample = "网上打字测试,点开始之后可以开始打字,按下第一个键之后开始计时," +
"打字结束之后可以按计算速度计算你刚才打字的速度,下方同时显示错误的字数、经过的时间。" +
"打错的字是红色显示,正确的是蓝色字,还没有打的是黑色。"
var costTime = _class("time")[0];
var costtime = 0;
var errorcount = 0;
var timer;
var haveEnter = false;
var fonttextarea = _class("fontTextarea")[0];
var beginbtn = _class("beginBtn")[0],
finishbtn = _class("finishBtn")[0];
var error = _class("error")[0],
speed = _class("speed")[0];
window.onload = function () {
fonttextarea.disabled = true;
fontstring.innerText = strExample;
fonttextarea.onkeydown = function () {
var strcount = 0;
var str = "";
if (fonttextarea.value == "") return;
if (!haveEnter) {
haveEnter = true;
costtime = 0;
timer = setInterval(function () {
showtimeFun();
}, 1000);
}
for (var i = 0; i < strExample.length - 1; i++) {
if (i < fonttextarea.value.length) {
if (fonttextarea.value.slice(i, i + 1) == strExample.slice(i, i + 1)) {
str = str + "<span class='rightfont'>" + strExample.slice(i, i + 1) + "</span>";
}
else {
str = str + "<span class='errorfont'>" + strExample.slice(i, i + 1) + "</span>";
strcount++;
}
}
else {
str = str + strExample.slice(i, i + 1);
}
}
errorcount = strcount;
fontstring.innerHTML = str;
error.innerText = errorcount;
}
function showtimeFun() {
costtime++;
costTime.innerText = costtime;
}
beginbtn.onclick = function () {
errorcount = 0;
fontstring.innerText = strExample;
fonttextarea.value = "";
fonttextarea.disabled = false;
fonttextarea.focus();
error.innerText = errorcount;
speed.innerText = "0";
}
finishbtn.onclick = function () {
clearInterval(timer);
costTime.innerText = 0;
fonttextarea.disabled = true;
var sp = 0;
if (fonttextarea.value == "") {
return sp;
} else {
sp = Number(fonttextarea.value.length * 60 / costtime).toFixed(2);
speed.innerText = sp;
haveEnter = false;
}
}
}
</script>
系统已开启自动识别垃圾评论机制,识别到的自动封号,下载出错或者资源有问题请联系全栈客服QQ 1915635791