软键盘的下拉窗口

keyboard.htm:

 1<html>
 2<head>
 3<meta content="text/html; charset=utf-8" http-equiv="Content-Type"/>
 4<title>keyboard</title>
 5<style>   
 6td{border:1px solid black;width:35px;text-align:center;color:white;font-weight:bold;background:black;}   
 7</style>
 8<script language="JavaScript" src="keyboard.asp"></script>
 9</head>
10<body>
11<input id="ttt" onfocus="tt1.style.display=''"/>
12</body>
13</html>

keyboard.asp:
document.write("

1<table id="tt1" onmouseout="tt1.style.display='none'" onmouseover="tt1.style.display=''" style="position:absolute;top:40px;left:10px;display:none">");   
2document.write("<tr>");   
3document.write("<td onclick="ttt.value+=this.innerText">1</td>");   
4document.write("<td onclick="ttt.value+=this.innerText">2</td>");   
5document.write("<td onclick="ttt.value+=this.innerText">3</td>");   
6document.write("<td onclick="tt1.style.display='none';tt2.style.display=''">→</td>");   
7document.write("</tr>");   
8document.write("</table>

");
document.write("

1<table id="tt2" onmouseout="tt2.style.display='none'" onmouseover="tt2.style.display=''" style="position:absolute;top:40px;left:10px;display:none">");   
2document.write("<tr>");   
3document.write("<td onclick="ttt.value+=this.innerText">a</td>");   
4document.write("<td onclick="ttt.value+=this.innerText">b</td>");   
5document.write("<td onclick="ttt.value+=this.innerText">c</td>");   
6document.write("<td onclick="tt2.style.display='none';tt1.style.display=''">←</td>");   
7document.write("</tr>");   
8document.write("</table>

");