谁帮帮整整代码喂。。。。。。。。。

1.为什么要输入2个字符才出提示框，有什么办法在用OnKeyPress或onkeydown事件的情况下改正过来不？（或者用onkeyup事件能在按着键不动的情况下能持续切换也行的）
2.在按键盘上下的时候能让滚动条跟随滚动。<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-
transitional.dtd">
<html>
<head>
<title>自动提示的文本框</title>
<style>

</style>
<script language="javascript">
var oInputField;    //考虑到很多函数中都要使用
var oPopDiv;        //因此采用全局变量的形式
var oColorsUl;
var aColors = ["red","rcd","rbd","rad","green","blue","magenta","yellow","chocolate","black","aquamarine","lime","fuchsia","brass","azure","brown","bronze","deeppink","aliceblue","gray","copper","coral","feldspar","orange","orchid","pink","plum","quartz","purple","antiquewith","blanchedalmond","blueviolet","beige","burlywood","bisque","cadetblue","saddlebrown","royalblue","rosybrown","orengered","olivedrab","powderblue","peachpuff","papayawhip","paleturquoise","palevioletred","palegreen","navyblue","navajowhite","palegodenrod","violetred","yellowgreen","tomato","turquoise","thistle","springgreen","steelblue","salmon","scarlet","silver","violet","snow","tan","chartreuse","khaki","mediumslateblue","mediumvioletred","oldlace","maroom","goldenrod","wheat","whitesmoke","moccasin","mistyrose","mintcream","midnightblue","dimgray","darksalmon","slategray","skyblue","sienna","seashell","seagreen","sandybrown","gold","mediumturquoise","navy","mediumspringgreen","mediumseagreen","mediumpurpul","peru","mediumorchid","mediumblue","mediumaquamarine","maroon","limegreen","lightyellow","lightsteelblue","magenta","lightslateblue","lightslategray","lightskyblue","inen","lightseagreen","lightsalmon","lightpink","lightgray","lightgreen","lightgodenrodyellow","indianred","lavender","lightblue","lavenderblush","lightcoral","lightcyan","lightgodenrod","hotpink","greenyellow","lemonchiffon","lawngreen","deepskyblue","honeydew","golenrod","forestgreen","gostwhite","gainsboro","firebrick","dodgerblue","darkturquoise","darkslateblue","darkslategray","darkseagreen","darkred","darkorchid","darkorenge","darkviolet","floralwhite","cyan","darkgray","cornsilk","darkolivegreen","darkgoldenrod","darkblue","darkcyan","darkgreen","darkhaki","ivory","darkmagenta","cornfloewrblue"];
aColors.sort();    //按字母排序，使显示结果更友好
function initVars(){
    //初始化变量
    oInputField = document.forms["myForm1"].colors;
    oPopDiv = document.getElementById("popup");
    oColorsUl = document.getElementById("colors_ul");
}
function clearColors(){
    //清除提示内容
    for(var i=oColorsUl.childNodes.length-1;i>=0;i--)
        oColorsUl.removeChild(oColorsUl.childNodes[i]);
    oPopDiv.className = "hide";
}
function setColors(the_colors){
    //显示提示框，传入的参数即为匹配出来的结果组成的数组
    clearColors();    //每输入一个字母就先清除原先的提示，再继续
    oPopDiv.className = "show";
    var oLi;
    for(var i=0;i<the_colors.length;i++){
        //将匹配的提示结果逐一显示给用户
        oLi = document.createElement("li");
        oColorsUl.appendChild(oLi);
        var tt=document.getElementById('colors').value;
        oLi.trueValue=the_colors[i];
        oLi.colorValue=the_colors[i].replace(tt,"<font color=red>"+tt+"</font>");
        oLi.innerHTML=oLi.colorValue;
        //oLi.appendChild(document.createTextNode(the_colors[i]));        oLi.onmouseover = function(){
            this.className = "mouseOver";    //鼠标经过时高亮
        }
        oLi.onmouseout = function(){
            this.className = "mouseOut";    //离开时恢复原样
        }
        oLi.onclick = function(){
            //用户点击某个匹配项时，设置输入框为该项的值
            oInputField.value = this.trueValue;
            clearColors();    //同时清除提示框
            document.getElementById('colors').onclick=function(){
                location.href='http://www.baidu.com/s?wd='+this.value;
            };
        }
    }
}
var preLi=null;
function findColors(event){
    initVars();        //初始化变量
    var colors_ul = document.getElementById('colors_ul');
    var lis = colors_ul.getElementsByTagName('li');
    var liLen=lis.length;
    var li;

    var e = event||window.event;
    if(e.keyCode==38)//上
    {
        if(currentLI>0){
            currentLI--;
        }
else{
currentLI=liLen-1;
}        li = lis[currentLI];
        if(preLi!=null){
            preLi.className = "mouseOut";
        }
        li.className="mouseOver";
        preLi=li;
        document.getElementById('colors').value=li.trueValue;
        document.getElementById('colors').onclick=function(){
            location.href='http://www.baidu.com/s?wd=';
        };
    }
    else if(e.keyCode==40)
    {//下
        if(currentLI<liLen-1){
            currentLI++;
        }
else{
currentLI=0;
}        li = lis[currentLI];
        if(preLi!=null){
            preLi.className = "mouseOut";
        }
        li.className="mouseOver";
        preLi=li;
        document.getElementById('colors').value=li.trueValue;
        document.getElementById('colors').onclick=function(){
            location.href='http://www.baidu.com/s?wd='+this.value;
        };
    }else{//其他键值

    if(oInputField.value.length > 0){
        var aResult = new Array();        //用于存放匹配结果
        for(var i=0;i<aColors.length;i++)    //从颜色表中找匹配的颜色
            //必须是从单词的开始处匹配
            if(aColors[i].indexOf(oInputField.value) == 0)
                aResult.push(aColors[i]);    //压入结果
        if(aResult.length>0)    //如果有匹配的颜色则显示出来
            setColors(aResult);
        else                    //否则清除，用户多输入一个字母
            clearColors();        //就有可能从有匹配到无，到无的时候需要清除
    }
    else
        clearColors();    //无输入时清除提示框（例如用户按del键）
    currentLI=-1;
    }
}
</script>
</head>
<body>
<form method="post" name="myForm1">
Color: <input type="text" name="colors" id="colors" OnKeyPress="findColors(event);" />
</form>
<div id="popup">
    <ul id="colors_ul"></ul>
</div>
</body>
</html>

解决方案 »

免费领取超大流量手机卡，每月29元包185G流量+100分钟通话, 中国电信官方发货

Color: <input type="text" name="colors" id="colors" onkeyup="findColors(event);" />
1、你要的功能都出来了，包括滚动条；最后一个函数就是操作滚动条的
2、这个就是纯JS，根本不是JQ,你被我的自定义函数$()给吓住了吧，look：
function $(id){return document.getElementById(id)}
3、我测试的环境：IE6/FF4;
4、你原盘拷贝，测试一下，先不要改动任何代码
还有能帮讲解下为什么用OnKeyPress或onkeydown要输入了2个字符才开始匹配呢？
1、【帮我改回通用版咯，去掉$符号行不？】
  哈哈，好说好说：
1）把$用document.getElementById替换；
2）删除function $(id){return document.getElementById(id)}那一行2、【为什么用OnKeyPress或onkeydown要输入了2个字符才开始匹配呢】：
  这是最烦的地方，要真讲透要啰嗦一阵了，我简单说说：
1）文本框onkeydown时候，它的value并没有赋值进去，还维持这敲击键盘前的状态，例如，当第一次输入字母a时，文本框的值是空的，不是a；你的程序是判断如果为空就清除<ul>,所以不匹配，keypress也是这样；
  2）第二次输入a时开始匹配的也不是aa(尽管文本框显示的是aa)，实际上匹配的是第二次输入前的状态,就是a;因此这样是不正确的；我想了很多办法，但都没有可能同时满足浏览器兼容和你的滚动条的要求，最后只好放弃。-------------
现在的原理是：
1、keydown只负责滚动条的功能（不能用kepress,IE6根本不响应上下箭头38、40两个键）
2、keyuop负责填充你的suggestion<UL>
3、尽量减少全局变量（时间关系我没帮你做封装，实际做了封装才好。不然以后用起来有可能变量冲突的）
所以我才要你原判拷贝进行测试的。
注意：把$用document.getElementById替换时一定要仔细，要全部替换掉。
不然你把function $(id){return document.getElementById(id)}删除后，如果有$没替换掉，程序就罢工了
else { //其他键值
if (oInputField.value.length > 0) {
var aResult = new Array(); //用于存放匹配结果
for (var i = 0; i < aColors.length; i++) //从颜色表中找匹配的颜色第一次OnKeyPress或onkeydown的时候，oInputField.value.length还是等于0，故下面找匹配颜色就不会执行如果是onkeyup表示键按下去又弹上来了，这个时候oInputField.value.length=1
如果没有按住上下箭头让程序连续滚动选择的问题就简单了，一个keyup就OK了。
我看了看BAIDU的代码，也看了另一个老外的代码，那函数比我们的要复杂很多很多很多....
刚看的时候，我还不以为然，但仔细看了IE和FF手册后就灰心了，才知道他们那样做也是不得已。当然，他们的几乎囊括的所有浏览器的兼容。呵呵