`
ykyfendou
  • 浏览: 408011 次
  • 性别: Icon_minigender_1
  • 来自: 北京
社区版块
存档分类
最新评论

js特效--打字速度测试

阅读更多

样式:



 

 

HTML代码:

<!-- 打字速度测试 -->
 <SCRIPT LANGUAGE="JavaScript">
<!-- Begin
msg = new Array("Practicing with your typing can greatly help your overall computer skills.",
"A new computer is sold in the US every hour!",
"When do birds migrate from North to South?",
"Perplexing phrases, like this one, are tougher to type.")
word = 10
function m() {
msg = new Array("Practicing with your typing can greatly help your overall computer skills.",
"A new computer is sold in the US every hour!",
"When do birds migrate from North to South?",
"Perplexing phrases, like this one, are tough to type.")
word = 10
}
function e() {
msg = new Array("If you can correctly, and quickly, type this perplexing sentence, you are one superb typist!",
"You are one superb typist if you can correctly, and quickly, type this long phrase.",
"I believe you're a good typist, so I believe you will correctly copy this statement!",
"Because this is not a fairly simple phrase, could you swiftly, and precisely, copy it?")
word = 15
}
function s() {
msg = new Array("Computers are the medium of the future.",
"Can you type this phrase rather quickly?",
"Who is the President of the US?",
"I believe that you can type well!")
word = 7
}
function beginIt() {
randNum = Math.floor((Math.random() * 10)) % 4
msgType = msg[randNum]
day = new Date();
startType = day.getTime();
document.theForm.given.value = msgType
document.theForm.typed.focus();
document.theForm.typed.select();
}
function cheat() {
alert("对不起,这里的内容你不能改变!!");
document.theForm.typed.focus();
}
function stopIt() {
dayTwo = new Date();
endType = dayTwo.getTime();
totalTime = ((endType - startType) / 1000)
spd = Math.round((word/totalTime) * 60)
if (document.theForm.typed.value == document.theForm.given.value) {
alert("\n你输入了 " + word + " 个字符,在 " 
+ totalTime + " 秒内, 速度为每秒钟 " + spd + " 个字符!")
}
else {
alert("你输入有错,但是你每分钟输入 " + spd + " 个字符.")
   }
}
// End -->
</SCRIPT>
<div style="position: absolute;top: 900px">
<FORM name="theForm">
<TABLE BORDER=3 CELLSPACING=0 CELLPADDING=0>
<TR>
<TD>你是个...</TD>
<TD align=center><input type=radio name="sme" value="Beginner" onClick="s()" checked>初级者
<input type=radio name="sme" value="Novice" onClick="m()">中级者
<input type=radio name="sme" value="Expert" onClick="e()">高级者</TD>
</TR>
<TR><TD colspan=2><BR>
<center><input type=button value="开始测试" name="start" onClick="beginIt()"></center><P>
<textarea name="given" cols=53 rows=3 wrap=on onFocus="cheat()"></textarea></TD>
</TR>
<TR><TD colspan=2><center><input type=text name="typed" size=45>
<input type=button value="完成"  name="stop"  onClick="stopIt()"></center></TD>
</TR>
</TABLE></FORM>
</div>

 

  • 大小: 59.1 KB
分享到:
评论

相关推荐

    javascript经典特效---测试打字速度.rar

    在打字速度测试中,我们需要获取用户输入的文本框,可能使用`document.getElementById`或`querySelector`等方法,以及设置或获取元素的值(`value`属性)。 2. **事件监听**:JavaScript的事件机制是关键,我们需要...

    js 特效 html 特效 测试打字速度

    js 特效 html 特效 测试打字速度 js 特效 html 特效 测试打字速度

    js网页特效打字测速

    本程序为网页版打字速度测试,采用javascript编写,适合于课程设计交作业。本程序为网页版打字速度测试,采用javascript编写,适合于课程设计交作业。本程序为网页版打字速度测试,采用javascript编写,适合于课程...

    HTML5键盘打字速度测试代码.zip

    在打字速度测试中,jQuery被用来监听键盘输入事件,计算用户每秒输入的字符数,同时更新界面上的速度显示。通过`.keydown()`和`.keyup()`方法,可以追踪用户按下和释放键盘键的动作,进一步计算出打字速度。此外,...

    js网页打字速度测试

    在这个项目中,虽然标签中提到了jQuery特效,但实际的打字速度测试可能并不需要复杂的特效,主要还是依赖于原生JavaScript。不过,如果要增强用户体验,例如添加动态显示速度的动画效果,jQuery的`.animate()`方法...

    HTML5键盘打字速度测试特效代码

    在这个“HTML5键盘打字速度测试特效代码”中,我们可以看到HTML5是如何结合JavaScript和CSS来实现一个简单的打字速度测试应用的。 首先,HTML5提供了丰富的标签来结构化网页内容。例如,`&lt;header&gt;`定义页面头部,`...

    HTML5键盘打字速度测试代码

    HTML5键盘打字速度测试代码是一个利用JavaScript和HTML5技术实现的小型应用,旨在帮助用户提升打字速度和准确性。这个应用通常以游戏的形式呈现,用户需要按照屏幕上的字母顺序快速准确地敲击键盘,系统会记录并显示...

    网页特效——键盘篇

    本篇文章将深入探讨“网页特效——键盘篇”,涵盖ASCII代码、Ctrl+Enter提交、打字效果、打字机效果以及打字速度测试等多个方面,这些都是网页编程中与键盘操作相关的精彩实践。 首先,ASCII代码是计算机科学中的...

    javascript网页特效实例大全

    10.3 打字速度测试 264 10.4 改变图片提示背景颜色 266 10.5 渐变色表格 269 10.6 列表内容相互转换 270 10.7 身体健康测试 273 10.8 网络知识测试 275 10.9 方框线上的闪耀效果 278 10.10 自动隐藏的菜单 ...

    js文字特效

    本篇将深入探讨"js文字特效"这一主题,包括其核心概念、实现方式以及如何将其应用到实际项目中。 一、JavaScript文字特效的基础 1. DOM操作:JavaScript通过Document Object Model (DOM)与网页内容进行交互。通过...

    94个网页特效javascript

    这些JavaScript特效不仅展示了语言的强大功能,也为开发者提供了丰富的灵感和参考资料。通过学习和实践这些代码,开发者可以提升自己的JavaScript技能,并将这些特效应用到实际项目中,创造出更具吸引力的网页。

    jQuery使用l-by-l.min.js插件实现键盘打出逐字逐句显示文字特效源码.zip

    本资源"jQuery使用l-by-l.min.js插件实现键盘打出逐字逐句显示文字特效源码.zip"提供了一个具体的应用示例,用于演示如何利用jQuery和一个名为l-by-l.min.js的插件来创建一种键盘打字效果,这种效果通常在网页设计中...

    10种jQuery打字机文字飞入动画代码

    **jQuery打字机文字飞入动画**是一种动态展示文本的特效,常用于网站的欢迎页或介绍部分,能吸引用户注意力并提升用户体验。在本文中,我们将深入探讨10种不同的jQuery实现打字机文字飞入动画的方法,以及如何通过...

    程序天下:JavaScript实例自学手册

    第1章 页面特效 1.1 HTML页面反向显示 1.2 页面自动最大化 1.3 页面自动刷新 1.4 页面的后退、刷新、前进 1.5保护网页源代码 1.6 保护自己的网页不被放入框架 1.7 保护自己的网页不被放入框架 1.8 打印页面的出错...

    《程序天下:JavaScript实例自学手册》光盘源码

    第1章 页面特效 1.1 HTML页面反向显示 1.2 页面自动最大化 1.3 页面自动刷新 1.4 页面的后退、刷新、前进 1.5保护网页源代码 1.6 保护自己的网页不被放入框架 1.7 保护自己的网页不被放入框架 1.8 打印页面的出错...

    Typing_Game(Edition2)

    《Typing_Game(Edition2)》是一款基于JavaScript开发的打字游戏,旨在通过游戏化的方式提升用户的打字速度和准确性。这款打字游戏利用了JavaScript的面向对象编程思想,为玩家提供了一个互动性强、寓教于乐的学习...

    《ACCP 软件工程师 5.0 教学PPT和源代码 内部光盘》(Aptech ACCP 5.0 PPT and Resource)[光盘镜像]

    - **运指如飞**:提高打字速度的练习软件。 - **教学电子课件**:按照不同阶段和主题进行了分类,包括但不限于以下内容: - S1阶段:涵盖基础知识和技术入门。 - S2阶段:深化技术理解和实践能力。 - Y2阶段:...

    超实用的jQuery代码段

    11.27 使用递归函数创建文字闪烁特效 11.28 使用ID选择器加快选择的速度 11.29 在类选择器前用标签选择器加快速度 11.30 缓存jQuery对象以提升性能 11.31 使用find()函数提升子查询的性能 11.32 使用jQuery操作DOM...

Global site tag (gtag.js) - Google Analytics