CSDN博客

img goody9807

用JS写的一段打字测验的程序

发表于2004/10/29 9:18:00  1700人阅读

分类: JavaScript

从数据库中取出一段文字,分多行放到页面上,每行文字下面留一空行供用户对照输入,输入的过程中记录错误的字数。不需要判断时间速度等因素。

完整代码
<TITLE>aa</TITLE>
<META HTTP-EQUIV=Content-Type CONTENT=text/html; charset=gb2312>


<input id=inpu_onoff type=button value='Start' onclick='f_start()'>

<br>
<input name="Input" id=inpu_text style='font-size:24px' size=49 maxlength=50>
<input id=inpu_type readonly size=49 maxlength=50 style='font-size:24px'>
<input id=inpu_wrong readonly size=49 maxlength=50 style='font-size:24px'>


<p><input name=radi_resource type=radio onclick=f_set_res()>Article
<input name=radi_resource type=radio onclick=f_set_res()>Full
<input name=radi_resource type=radio onclick=f_set_res() checked>DVORAK
<input name=radi_resource type=radio onclick=f_set_res()>Alpha
<input name=radi_resource type=radio onclick=f_set_res()>Number
<input name=radi_resource type=radio onclick=f_set_res()>Empty

<input id=chec_ifrandom type=checkbox checked>Random

<br><textarea id=text_sample rows=5 cols=80></textarea>

<p>

<table width=100%>
  <tr>
    <td width=40%>
<input id=inpu_speed readonly>Char/Minute
<br><input id=inpu_right readonly>Right Rate
<br><input id=inpu_disptime readonly>Cost Time
<br><input id=inpu_righttype readonly>Input Right
<br><input id=inpu_ttltype readonly>Input Total
    </td>
    <td>
<p><textarea id=text_result rows=8 cols=30></textarea>Result History
    </td>
  </tr>
</table>

<script>/////////////////END BOX//////////////////</script>


<script>/////////////////START HIDDEN//////////////////</script>
<input name="Input2" id=Input style='display:none'>
<textarea id=text_article style='display:none'>

The Dvorak Keyboard

Almost everyone knows that the QWERTY keyboard was designed by Christopher Sholes to prevent the arms in old manual

typewriters from jamming. Fewer people know that a University of Washington professor and efficiency fanatic, August Dvorak

(a cousin of the composer), in 1936, designed a keyboard to maximize efficiency (by placing common letters on the home row),

and make the stronger fingers of the hands do most of the work.
I was surprised by the factoid (gathered from Grolier's Encyclopedia) that part of the QWERTY layout was driven by the

decision to place all of the letters in the word "typewriter" on the top row so that salesmen wouldn't have to hunt and peck.

I've always been bothered by poor design or engineering, so ever since hearing about the Dvorak keyboard I wanted to switch.

I finally took the plunge in 1989 and haven't regretted it. Since then, because of repetitive stress injuries (RSI) and

carpal tunnel syndrome, many people have asked me about the Dvorak keyboard, and bit by bit I've become something of an

evangelist.

Pictured below is the Dvorak keymapping. I learned it by printing out a diagram like this one, and placing it next to my

terminal. I regained comfort after a couple weeks, and eventually passed my old speed. It is definitely more comfortable than

QWERTY. An unintended side effect is that it is a pretty effective security device (just ask any of my coworkers).

</textarea>

<script>/////////////////END HIDDEN//////////////////</script>

 

<script>/////////////////START JS//////////////////</script>
<script>

/////////////////START USER JS FUNCTION//////////////////

f_start()  ///auto start, when onload run the main


function f_start()  //reset all, set text, get ready to go
{
  inpu_text.value=''
  inpu_type.value=''
  inpu_wrong.value=''

  inpu_curtime.value=0

  inpu_speed.value='0.00'
  inpu_right.value='0.00%'
  inpu_disptime.value='0:0:0.0'
  inpu_righttype.value=0
  inpu_ttltype.value=0

  inpu_onoff.outerHTML="<input id=inpu_onoff type=button value='......:::::: 3 ::::::......' onclick='f_stop()' disabled>"
  f_set_res()
  f_readygo()
}

function f_stop()  //when end typing stop time
{
  clearTimeout(tt_timeout)
  inpu_type.readOnly=true
  inpu_onoff.outerHTML="<input id=inpu_onoff type=button value='Start' onclick='f_start()'>"
  inpu_onoff.focus()
  f_result()
}

function f_readygo()  //2~~~1...GO!!! when ready start time & input
{
  tt_timeout=setTimeout("inpu_onoff.value='~~~~~~~~~~~~~~~~~~2'",1000)
  tt_timeout=setTimeout("inpu_onoff.value='1............'",2000)
  tt_timeout=setTimeout("inpu_onoff.value='!!!!!!!!!!!!!!!!!! GO !!!!!!!!!!!!!!!!!!'",3000)
  tt_timeout=setTimeout('f_settext()',3000)
  tt_timeout=setTimeout('inpu_type.readOnly=false;inpu_type.focus()',4000)
  tt_timeout=setTimeout("inpu_onoff.value='Stop';inpu_onoff.disabled=false",4000)
  tt_timeout=setTimeout('f_refresh()',4000)
}

function f_settext()  //random or not
{
  if(chec_ifrandom.checked==1)
  {
    f_randomtext()
  }
  else
  {
    f_ordertext()
  }
}

function f_ordertext()  //show 50 order words in input box
{
  temp_array=text_sample.value.split('/r/n').join('')
  temp_random=Math.round(Math.random()*(temp_array.length-50))
  inpu_text.value=temp_array.substr(temp_random,50)
}

function f_randomtext()  //show 50 random chars in input box
{
  temp_array=text_sample.value.split('/r/n').join('')
  temp_random=temp_array
  inpu_text.value=''
  for(i=0;i<50;i++)
  {
    char_rand=temp_random.charAt(Math.round(Math.random()*(temp_random.length-1)))
    inpu_text.value+=char_rand
  }
}

function f_result()  //show speed & right & time & input
{
  text_result.value+=inpu_speed.value+'/t'+'Char/Minute'+'/n'
  text_result.value+=inpu_right.value+'/t'+'Right Rate'+'/n'
  text_result.value+=inpu_disptime.value+'/t'+'Cost Time'+'/n'
  text_result.value+=inpu_righttype.value+'/t'+'Input Right'+'/n'
  text_result.value+=inpu_ttltype.value+'/t'+'Input Total'+'/n'
  text_result.value+=Date()+'/n'+'/n'
  text_result.scrollTop+=110
}

function f_refresh()
{
  f_show_time()
  f_show_record()
  tt_timeout=setTimeout('f_refresh()',100)  //refresh time per 0.1seconds
}

function f_show_time()
{
  inpu_curtime.value++  //set time into input box

  temp=new Array

  temp[0]=parseInt(inpu_curtime.value)  //get real millions
  temp[1]=parseInt(inpu_curtime.value/10)  //get real seconds
  temp[2]=parseInt(inpu_curtime.value/10/60)  //get real minutes
  temp[3]=parseInt(inpu_curtime.value/10/60/60)  //get real hours

  temp[0]=temp[0]%10  //only millions
  temp[1]=temp[1]%60  //only seconds
  temp[2]=temp[2]%60  //only minutes
  temp[3]=temp[3]  //only hours

  inpu_disptime.value=temp[3]+':'+temp[2]+':'+temp[1]+'.'+temp[0]  //put time into input box
}

function f_show_record()
{
  inpu_ttltype.value=inpu_type.value.length
  inpu_speed.value=(inpu_ttltype.value/(inpu_curtime.value/10)*60).toFixed(2)

  //Input Right Begin
  inpu_righttype.value=inpu_ttltype.value
  inpu_wrong.value=''
  for(i=0;i<inpu_ttltype.value;i++)
  {
    if(inpu_text.value.charAt(i)!=inpu_type.value.charAt(i))  //diff text & type
    {
      inpu_righttype.value--  //if diff
      inpu_wrong.value+='?'  //type wrong alert
    }
    else  //same (type right)
    {
      inpu_wrong.value+=' '  //show type right
    }
  }
  //Input Right End

  //Right Rate Begin
  if(inpu_ttltype.value==0)
    inpu_right.value='0.00%'
  else
    inpu_right.value=(inpu_righttype.value/inpu_ttltype.value*100).toFixed(2)+'%'
  //Right Rate End
}

function f_set_res()  //show radio
{
  if(radi_resource[0].checked==true)
  {
    text_sample.value=text_article.value
  }
  else if(radi_resource[1].checked==true)
  {
    text_sample.value='`1234567890[]/~!@#$%^&*(){}|/',.pyfgcrl/="<>PYFGCRL?+aoeuidhtns-AOEUIDHTNS_;qjkxbmwvz:QJKXBMWVZ '
  }
  else if(radi_resource[2].checked==true)
  {
    text_sample.value='/',.pyfgcrlaoeuidhtns;qjkxbmwvz'
  }
  else if(radi_resource[3].checked==true)
  {
    text_sample.value='abcdefghijklmnopqrstuvwxyz'
  }
  else if(radi_resource[4].checked==true)
  {
    text_sample.value='1234567890'
  }
  else if(radi_resource[5].checked==true)
  {
    text_sample.value=''
  }
}

/////////////////END USER JS FUNCTION//////////////////


/////////////////START SYSTEM JS FUNCTION//////////////////

function document.onkeydown()
{
  if(event.keyCode==13&&inpu_onoff.value=='Stop')
  {
    f_stop()
    return false
  }
}

/////////////////END SYSTEM JS FUNCTION//////////////////

</script>
<script>/////////////////END JS//////////////////</script>

<SCRIPT>
document.execCommand("stop") //Do not run the following rubbish code
</SCRIPT>
<!-- MyStyle
<input id=inpu_abc onclick='f_abc()'>
<script>
function f_abc()
{
  alert()
}
</script>
-->

阅读全文
0 0

相关文章推荐

img
取 消
img