上 下 左 右 --各位大虾帮帮忙

<HTML>
 <HEAD>
  <TITLE> New Document </TITLE>
  <META NAME="Generator" CONTENT="EditPlus">
  <META NAME="Author" CONTENT="">
  <META NAME="Keywords" CONTENT="">
  <META NAME="Description" CONTENT="">
 </HEAD> <BODY onkeydown= "do_change()">
  <table id="tab">
  <tr><td><input type = "text" ></td><td><input type = "text" ></td></tr>
  <tr><td><input type = "text" ></td><td><input type = "text" ></td></tr>
  <tr><td><input type = "text" ></td><td><input type = "text" ></td></tr>
  <tr><td><input type = "text" ></td><td><input type = "text" ></td></tr>
  </table>
 </BODY>
</HTML>
<SCRIPT LANGUAGE="JavaScript">
<!--
function do_change(){
//var tab = document.getElementById("tab");
/// tab.rows[0].cells[0].firstChild.focus();
//alert(tab.rows.length)
}
//-->
</SCRIPT>各位大虾可以把上面代码复制下来 看看 本人想实现的效果为当本人按键盘上的方向键时 使光标可以在各个文本框内来回动(和在EXCEL中一样)!

解决方案 »

  1.   

    有个比较偷懒的办法，不过还得让DIV里防止粘贴删除什么的。
    <div contentEditable="true">
    <table border="1">
      <tr><td>&nbsp;</td><td>&nbsp;</td></tr>
      <tr><td>&nbsp;</td><td>&nbsp;</td></tr>
      <tr><td>&nbsp;</td><td>&nbsp;</td></tr>
      <tr><td>&nbsp;</td><td>&nbsp;</td></tr>
    </table>
    </div>
      

  2.   

    <HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <script>
    function do_change(){
    var cur_focus=hidden1.value;
    var row=cur_focus.substring(1,2);
    var col=cur_focus.substring(2,3);
    if(event.keyCode==40&&row!=4){
    eval("t"+(parseInt(row)+1)+col).focus();
    hidden1.value="t"+(parseInt(row)+1)+col;
    }else if(event.keyCode==38&&row!=1){
    eval("t"+(parseInt(row)-1)+col).focus();
    hidden1.value="t"+(parseInt(row)-1)+col;
    }else if(event.keyCode==37&&col!=1){
    eval("t"+row+(parseInt(col)-1)).focus();
    hidden1.value="t"+row+(parseInt(col)-1);
    }else if(event.keyCode==39&&col!=2){
    eval("t"+row+(parseInt(col)+1)).focus();
    hidden1.value="t"+row+(parseInt(col)+1);
    }
    }
    function b(){
    t11.focus();
    hidden1.value="t11";
    }
    </script>
    </HEAD>
    <BODY onkeydown="do_change()" onload="b()">
    <table id="tab">
    <tr><td><input type="text" name="t11" id="t11"></td><td><input type = "text" name="t12" id="t12"></td></tr>
    <tr><td><input type="text" name="t21" id="t21"></td><td><input type = "text" name="t22" id="t22"></td></tr>
    <tr><td><input type="text" name="t31" id="t31"></td><td><input type = "text" name="t32" id="t32"></td></tr>
    <tr><td><input type="text" name="t41" id="t41"></td><td><input type = "text" name="t42" id="t42"></td></tr>
    </table>
    <input type=hidden id="hidden1" value="">
    </BODY>
    </HTML>
      

  3.   

    有点小错误,改正:<HTML>
    <HEAD>
    <TITLE> New Document </TITLE>
    <script>
    function do_change(){
    var cur_focus=hidden1.value;
    var row=cur_focus.substring(1,2);
    var col=cur_focus.substring(2,3);
    if(event.keyCode==40&&row!=4){
    eval("t"+(parseInt(row)+1)+col).focus();
    hidden1.value="t"+(parseInt(row)+1)+col;
    }else if(event.keyCode==38&&row!=1){
    eval("t"+(parseInt(row)-1)+col).focus();
    hidden1.value="t"+(parseInt(row)-1)+col;
    }else if(event.keyCode==37&&col!=1){
    eval("t"+row+(parseInt(col)-1)).focus();
    hidden1.value="t"+row+(parseInt(col)-1);
    }else if(event.keyCode==39&&col!=2){
    eval("t"+row+(parseInt(col)+1)).focus();
    hidden1.value="t"+row+(parseInt(col)+1);
    }
    }
    function a(obj){
    hidden1.value=obj.id;
    }
    function b(){
    t11.focus();
    }
    </script>
    </HEAD>
    <BODY onkeydown="do_change()" onload="b()">
    <table id="tab">
    <tr>
    <td><input type="text" name="t11" id="t11" onfocus="a(this)"></td>
    <td><input type="text" name="t12" id="t12" onfocus="a(this)"></td>
    </tr>
    <tr>
    <td><input type="text" name="t21" id="t21" onfocus="a(this)"></td>
    <td><input type="text" name="t22" id="t22" onfocus="a(this)"></td>
    </tr>
    <tr>
    <td><input type="text" name="t31" id="t31" onfocus="a(this)"></td>
    <td><input type="text" name="t32" id="t32" onfocus="a(this)"></td>
    </tr>
    <tr>
    <td><input type="text" name="t41" id="t41" onfocus="a(this)"></td>
    <td><input type="text" name="t42" id="t42" onfocus="a(this)"></td>
    </tr>
    </table>
    <input type=hidden id="hidden1" value="">
    </BODY>
    </HTML>