触摸屏上模拟数字键盘输入帐号和密码的JS

最近要做一个触摸屏上的小项目
由于没有键盘,只有触摸屏幕上的数字来向文本框中输入input的value小弟JS不是很熟悉,本来想找写现成的来用,结果木有找到.那么只好根据一些东西来改改了.
我找到了一段计算机器的代码.<HTML> 
<HEAD> 
<TITLE> New Document </TITLE> 
<SCRIPT LANGUAGE="JavaScript"> 
<!-- 
var showFlag = false; 
function fun(cmd){ 
var obj = document.getElementById("txt"); 
if(showFlag){ 
obj.value = ""; 
showFlag = false; 
} 
obj.value = obj.value + cmd; 
} function count(){ 
var obj = document.getElementById("txt"); 
try{ 
obj.value = obj.value + "=" + eval(obj.value); 
}catch(e){ } 
showFlag = true; 
} 
//--> 
</SCRIPT> 
<BODY> 
<TABLE border=1> 
<TR> 
<TD colspan="4" align="center"><input type="text" name="txt" value="" readonly style="text-align:right"></TD> 
</TR> 
<TR> 
<TD align="center"><input type="button" name="btn" value=" 7 " onclick="fun('7');"></TD> 
<TD align="center"><input type="button" name="btn" value=" 8 " onclick="fun('8');"></TD> 
<TD align="center"><input type="button" name="btn" value=" 9 " onclick="fun('9');"></TD> 
<TD align="center"><input type="button" name="btn" value=" + " onclick="fun('+');"></TD> 
</TR> 
<TR> 
<TD align="center"><input type="button" name="btn" value=" 4 " onclick="fun('4');"></TD> 
<TD align="center"><input type="button" name="btn" value=" 5 " onclick="fun('5');"></TD> 
<TD align="center"><input type="button" name="btn" value=" 6 " onclick="fun('6');"></TD> 
<TD align="center"><input type="button" name="btn" value=" - " onclick="fun('-');"></TD> 
</TR> 
<TR> 
<TD align="center"><input type="button" name="btn" value=" 1 " onclick="fun('1');"></TD> 
<TD align="center"><input type="button" name="btn" value=" 2 " onclick="fun('2');"></TD> 
<TD align="center"><input type="button" name="btn" value=" 3 " onclick="fun('3');"></TD> 
<TD align="center"><input type="button" name="btn" value=" * " onclick="fun('*');"></TD> 
</TR> 
<TR> 
<TD align="center"><input type="button" name="btn" value=" 0 " onclick="fun('0');"></TD> 
<TD align="center"><input type="button" name="btn" value=" = " onclick="count();"></TD> 
<TD align="center"><input type="button" name="btn" value=" . " onclick="fun('.');"></TD> 
<TD align="center"><input type="button" name="btn" value=" / " onclick="fun('/');"></TD> 
</TR> 
</TABLE> 
</BODY> 
</HTML>但是新的问题又出现了.
这里是不是要用到一个焦点的问题? 因为有两个文本框,一个是输入帐号,一个是输入密码的.焦点在这里如何使用呢? 如何得到焦点,然后可以输入帐号;如何失去焦点,可以输入密码?
假定有如下两个txtbox
<input type="text" name="userID" value="" readonly style="text-align:right">
<input type="text" name="psw" value="" readonly style="text-align:right">

解决方案 »

  1.   

    var obj = document.getElementById("txt");  那这里怎么写啊?现在不是一个 txtbox 而是两个txtbox 啊
      

  2.   

    定义一个全局的obj呗~<HTML>  
    <HEAD>  
    <TITLE> New Document </TITLE>  
    <SCRIPT LANGUAGE="JavaScript">  
    <!--  
    var selected_obj = null;
    var showFlag = false;  function selectobj(obj){
    if(selected_obj) selected_obj.style.backgroundColor='white';
    selected_obj = obj;
    obj.style.backgroundColor='beige';
    }function fun(cmd){  
    //var obj = document.getElementById("txt"); 
    if(!selected_obj) return;
    var obj = selected_obj;
    if(showFlag){  
    obj.value = "";  
    showFlag = false;  
    }  
    obj.value = obj.value + cmd;  
    }  function count(){  
    //var obj = document.getElementById("txt");  
    if(!selected_obj) return;
    var obj = selected_obj;
    try{  
    obj.value = obj.value + "=" + eval(obj.value);  
    }catch(e){  }  
    showFlag = true;  
    }  
    //-->  
    </SCRIPT>  
    <BODY>  
    <TABLE border=1>  
    <TR>  
    <TD colspan="4" align="center"><input type="text" name="txt" value="" onclick="selectobj(this);" readonly style="text-align:right"></TD>  
    </TR>  
    <TR>  
    <TD colspan="4" align="center"><input type="text" name="txt" value="" onclick="selectobj(this);" readonly style="text-align:right"></TD>  
    </TR>
    <TR>  
    <TD colspan="4" align="center"><input type="text" name="txt" value="" onclick="selectobj(this);" readonly style="text-align:right"></TD>  
    </TR>
    <TR>  
    <TD align="center"><input type="button" name="btn" value=" 7 " onclick="fun('7');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" 8 " onclick="fun('8');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" 9 " onclick="fun('9');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" + " onclick="fun('+');"></TD>  
    </TR>  
    <TR>  
    <TD align="center"><input type="button" name="btn" value=" 4 " onclick="fun('4');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" 5 " onclick="fun('5');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" 6 " onclick="fun('6');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" - " onclick="fun('-');"></TD>  
    </TR>  
    <TR>  
    <TD align="center"><input type="button" name="btn" value=" 1 " onclick="fun('1');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" 2 " onclick="fun('2');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" 3 " onclick="fun('3');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" * " onclick="fun('*');"></TD>  
    </TR>  
    <TR>  
    <TD align="center"><input type="button" name="btn" value=" 0 " onclick="fun('0');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" = " onclick="count();"></TD>  
    <TD align="center"><input type="button" name="btn" value=" . " onclick="fun('.');"></TD>  
    <TD align="center"><input type="button" name="btn" value=" / " onclick="fun('/');"></TD>  
    </TR>  
    </TABLE>  
    </BODY>  
    </HTML>
      

  3.   

    <input type="text" name="userID" value="" readonly style="text-align:right" id="userid">
    <input type="text" name="psw" value="" readonly style="text-align:right" id="psw">
    var userid = document.getElementById("userid "); 
    var psw=document.getElementById("psw"); 
    userid.focus()
    psw.focus()