本文实例讲述了JS模拟键盘打字效果的方法。分享给大家供大家参考。具体如下：
这里使用JS模拟实现软键盘及打字效果，点击软键盘年的字母键，文本框中即可显示文字，像是键盘打字的效果，美工不太好，没怎么美化，CSS高手可美化一下按钮，看上去还挺不错吧，我觉得。
先来看看运行效果图：
具体代码如下：
<html> <head> <meta http-equiv="Content-Type" content="text/html; charset=gb2312"> <title>模拟键盘打字</title> </head> <body> <script Language="Javascript"> function a() { var text=document.form.text.value document.form.text.value=text + "A"; } function b() { var text=document.form.text.value document.form.text.value=text + "B"; } function c() { var text=document.form.text.value document.form.text.value=text + "C"; } function d() { var text=document.form.text.value document.form.text.value=text + "D"; } function e() { var text=document.form.text.value document.form.text.value=text + "E"; } function f() { var text=document.form.text.value document.form.text.value=text + "F"; } function g() { var text=document.form.text.value document.form.text.value=text + "G"; } function h() { var text=document.form.text.value document.form.text.value=text + "H"; } function i() { var text=document.form.text.value document.form.text.value=text + "I"; } function j() { var text=document.form.text.value document.form.text.value=text + "J"; } function k() { var text=document.form.text.value document.form.text.value=text + "K"; } function l() { var text=document.form.text.value document.form.text.value=text + "L"; } function m() { var text=document.form.text.value document.form.text.value=text + "M"; } function n() { var text=document.form.text.value document.form.text.value=text + "N"; } function o() { var text=document.form.text.value document.form.text.value=text + "O"; } function p() { var text=document.form.text.value document.form.text.value=text + "P"; } function q() { var text=document.form.text.value document.form.text.value=text + "Q"; } function r() { var text=document.form.text.value document.form.text.value=text + "R"; } function s() { var text=document.form.text.value document.form.text.value=text + "S"; } function t() { var text=document.form.text.value document.form.text.value=text + "T"; } function u() { var text=document.form.text.value document.form.text.value=text + "U"; } function v() { var text=document.form.text.value document.form.text.value=text + "V"; } function w() { var text=document.form.text.value document.form.text.value=text + "W"; } function x() { var text=document.form.text.value document.form.text.value=text + "X"; } function y() { var text=document.form.text.value document.form.text.value=text + "Y"; } function z() { var text=document.form.text.value document.form.text.value=text + "Z"; } function space() { var text=document.form.text.value document.form.text.value=text + " "; } // --> </SCRIPT> <form name="form"> <p align="center"><textarea name="text" rows="10" cols="50"></textarea></p> <p align="center"><input type="button" name="B1" value=" Q "><input type="button" name="B2" value="W"><input type="button" name="B3" value="E"><input type="button" name="B4" value="R"><input type="button" name="B5" value="T"><input type="button" name="B6" value="Y"><input type="button" name="B7" value="U"><input type="button" name="B8" value=" I "><input type="button" name="B9" value="O"><input type="button" name="B10" value="P"></p> <p align="center"><input type="button" name="B11" value="A"><input type="button" name="B12" value="S"><input type="button" name="B13" value="D"><input type="button" name="B14" value="F"><input type="button" name="B15" value="G"><input type="button" name="B16" value="H"><input type="button" name="B17" value="J"><input type="button" name="B18" value="K"><input type="button" name="B19" value="L"></p> <p align="center"><input type="button" name="B20" value="Z"><input type="button" name="B21" value="X"><input type="button" name="B22" value="C"><input type="button" name="B23" value="V"><input type="button" name="B24" value="B"><input type="button" name="B25" value="N"><input type="button" name="B26" value="M"></p> <p align="center"><input type="button" name="B27" value=""></p> <INPUT TYPE="hidden" name="hidden"> </form> </body> </html>
希望本文所述对大家的javascript程序设计有所帮助。