请帮忙写一个上下选择的语句

限 IE 浏览器可用！L@_@K<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
 <head>
  <title>dhtml.simulateUpDownKeySelect.html</title>
  <meta name="generator" content="editplus" />
  <meta name="author" content="[email protected]" />
  <meta name="keywords" content="dhtml js csdn" />
  <meta name="description" content="for csdn.net" />
 </head> <body>
<h3 style="color: red;">限 IE 浏览器可用！</h3>
<input type="text" id="txtInput"/>
<div id="divSelect">
<li>123</li>
<li>456</li>
<li>abc</li>
<li>def</li>
<li>zzz</li>
</div>
 </body>
 <script type="text/javascript">
 <!--
function $(sId)
{
return document.getElementById(sId);
}function clearSelectedOptBgColor(target)
{
if (target.seletedIndex >= 0)
target.options[target.seletedIndex].style.backgroundColor = "";
}
function setSelectedOptBgColor(target)
{
target.options[target.seletedIndex].style.backgroundColor = "yellow";
}var upKeyCode = 38;
var downKeyCode = 40;
var enterKeyCode = 13;var oInput = $("txtInput");
oInput.options = $("divSelect").getElementsByTagName("li");
oInput.seletedIndex = -1;oInput.focus();
oInput.onkeyup = function(){
switch (event.keyCode)
{
case upKeyCode:
clearSelectedOptBgColor(this);
this.seletedIndex--;
if (this.seletedIndex < 0)
this.seletedIndex = this.options.length - 1;
setSelectedOptBgColor(this);
break; case downKeyCode:
clearSelectedOptBgColor(this);
this.seletedIndex++;
if (this.seletedIndex >= this.options.length)
this.seletedIndex = 0;
setSelectedOptBgColor(this);
break; case enterKeyCode:
this.value = this.options[this.seletedIndex].innerText;
break;
}
};
oInput.onblur = function(){
clearSelectedOptBgColor(this);
this.seletedIndex = -1;
};
 //-->
 </script>
</html>

解决方案 »

  1.   

    小小改动了一下，可兼容 IE 和 FireFox 浏览器！L@_@K<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
     <head>
      <title>dhtml.simulateUpDownKeySelect.html</title>
      <meta name="generator" content="editplus" />
      <meta name="author" content="[email protected]" />
      <meta name="keywords" content="dhtml js csdn" />
      <meta name="description" content="for csdn.net" />
     </head> <body>
    <h3 style="color: red;">可兼容 IE 和 FireFox 浏览器！</h3>
    <input type="text" id="txtInput"/>
    <div id="divSelect">
    <li>123</li>
    <li>456</li>
    <li>abc</li>
    <li>def</li>
    <li>zzz</li>
    </div>
     </body>
     <script type="text/javascript">
     <!--
    function $(sId)
    {
    return document.getElementById(sId);
    }function clearSelectedOptBgColor(target)
    {
    if (target.seletedIndex >= 0)
    target.options[target.seletedIndex].style.backgroundColor = "";
    }
    function setSelectedOptBgColor(target)
    {
    target.options[target.seletedIndex].style.backgroundColor = "yellow";
    }var upKeyCode = 38;
    var downKeyCode = 40;
    var enterKeyCode = 13;var oInput = $("txtInput");
    oInput.options = $("divSelect").getElementsByTagName("li");
    oInput.seletedIndex = -1;oInput.focus();
    oInput.onkeyup = function(event){
    if (event == undefined)
    event = window.event; switch (event.keyCode)
    {
    case upKeyCode:
    clearSelectedOptBgColor(this);
    this.seletedIndex--;
    if (this.seletedIndex < 0)
    this.seletedIndex = this.options.length - 1;
    setSelectedOptBgColor(this);
    break; case downKeyCode:
    clearSelectedOptBgColor(this);
    this.seletedIndex++;
    if (this.seletedIndex >= this.options.length)
    this.seletedIndex = 0;
    setSelectedOptBgColor(this);
    break; case enterKeyCode:
    this.value = this.options[this.seletedIndex].innerHTML;
    break;
    }
    };
    oInput.onblur = function(){
    clearSelectedOptBgColor(this);
    this.seletedIndex = -1;
    };
     //-->
     </script>
    </html>