data.chinahighlights.com/js/train/autocomplete.js

// JavaScript Document
//页面加载好，autoKey应该隐藏
//火车车次提示
jQuery(function($) {
	$.fn.autoCPT = function(options){
		var settings = $.extend({}, $.fn.autoCPT.defaults, options);
		//提示层的子层数组   
		var completesVal;   
		//将要显示的提示   
		var keys;   
		//时间延迟对象   
		var timeDelay; 
		
		$(this).each(function(){
			var highlightindex = -1;   
			var Obj=$(this);//输入框对象
			var ObjId = Obj.attr('id');
			Obj.attr("autocomplete", "off");
			var keyInputOffset=Obj.offset();
			if($("#"+settings.autoDID).size()>0){
				var autoDiv = $("#"+settings.autoDID);
			}else{
				var autoDiv=$("<div id=\""+settings.autoDID+"\"></div>"); 
			}
			autoDiv.html('').hide().css("border","1px solid #999999").css("position","absolute")
					.width( 240 )
					.css("color","#555555").css("z-index",settings.zindex).css("background-color","#FFFFFF").css("padding","0 10px 0 10px").appendTo("body");
			Obj.parents("form").bind("keypress",function(e){if( e.keyCode == 13 ){return false;}});
			Obj.bind('keyup focus click',function(event){   
				//获取键盘事件对象   
				var keyEvent=event || window.event;   
				//判断键盘输入的值得范围   
				//1.输入的是正常的字母   
				//2.向上向下键   
				//3。回车键
        		var keyCode=keyEvent.keyCode;
				
				if(keyCode !=38 && keyCode !=40 && keyCode != 13){   
					//获取当前文本框中的值   
					var currentVal=Obj.val();
					//如果当前的文本框内容为空，就不在向服务器发送请求
					if(currentVal != ""){   
						hideDv();//隐掉首弹
						//取消上次提交   
						window.clearTimeout(timeDelay);   
						//延迟500ms提交,防止频繁提交   
						timeDelay=window.setTimeout(function(){   
							var filterArr = new Array();
							var lenArr = settings.stationData.length;
							var lencur = currentVal.length;
							for(var i = 0,j=0;i<lenArr;i++){
								if(settings.stationData[i][3] == 1 || settings.stationData[i][3] == 2){
									if(currentVal.toLowerCase() == settings.stationData[i][1].substring(0,lencur).toLowerCase() ){
										filterArr.push(settings.stationData[i]);
										j ++;
										if(j>=10)break;
									}
								}
							}
							autoDiv.html("");
							var lenFtArr = filterArr.length;
							if(lenFtArr == 0) return;
							for(var i=0; i<lenFtArr; i++){
								$("<div data=\""+filterArr[i][0]+"\">").css("font-size","13px").css("line-height","25px").css("padding-top","1px")
								.html('<span>'+filterArr[i][1] + '</span>,' + filterArr[i][2] + ((filterArr[i][4].length>0)?('['+filterArr[i][4]+' Pro.]'):'')).appendTo(autoDiv);
							}
							
							if(lenFtArr>0){
								//为提示加上鼠标的选择功能   
								//鼠标over||out会触发事件，并高亮   
								//单击高亮层关闭提示层，并且把值传给文本框   
								completesVal=autoDiv.children("div");   
								//鼠标一移到autoKey上面，上下键的选择就取消   
								autoDiv.mouseover(function(){
									//highlightindex不等于-1说明先前用上下键移动过   
									if(highlightindex != -1){   
										//定位到那个节点，取消其高亮   
										completesVal.eq(highlightindex).css("background-color","white").css("color","#555555");
										//highlightindex = -1;   
										highlightindex = -1;   
									}   
								});   
  
								completesVal.each(function(){   
									var t=$(this);   
									t.css("cursor","pointer").mouseover(function(){   
										//加上mouseover事件   
										t.css("background-color","#e8f4ff").css("color","#000000");   
									}).mouseout(function(){
										//mouseout事件   
										t.css("background-color","white").css("color","#555555");   
									}).click(function(){   
										//单击事件   
										Obj.val(t.find('span').text());
										var Code = t.attr("data");
										var CHNa = "Code_"+Obj.attr("name");
										var CHid = "Code_"+Obj.attr("id");
										if($("#"+CHid).size()==0){
											Obj.after('<input type="hidden" name="'+CHNa+'" value="'+Code+'" id="'+CHid+'" />');
										}
										$("#"+CHid).val(Code);
										
										autoDiv.hide();   
									});   
								});   
  
								highlightindex = -1; 
								
								
								autoDiv.css("left",$('#'+ObjId).offset().left+settings.xOffset + "px")
									.css("top",$('#'+ObjId).offset().top + Obj.outerHeight() + settings.yOffset + "px")   
									autoDiv.show();   
							}else{   
								highlightindex = -1;   
								autoDiv.hide();   
							}   
						},100);   
					} else {
						showDv(Obj.attr('id'));$("[id="+settings.autoDID+"]").hide();return false;
					}
           
				}else if(keyCode == 38 || keyCode ==40 || keyCode == 13){   
					//第一步先获得提示框里所有补全信息的数组   
					// var completesVal=$("#autoKey").children("div");考虑到效率，把这步放到全局   
					//向下键的控制 
					if(keyCode == 40){   
						//如果现在的高亮是存在的，那么我们就要移动highlightindex   
						if(highlightindex != -1){   
							//去掉当前高亮   
							completesVal.eq(highlightindex).css("background-color","white").css("color","#555555");   
						}   
						//移动高亮的指针,   
						//注意这里的highlightindex++一定要放在if的外面，   
						// 放在里面如果hightlightindex=-1，则永远也移动不了   
						highlightindex++;   
						//判断是否到了最后一个元素   
						if(highlightindex >= completesVal.length){   
							highlightindex = 0;   
						}   
						//高亮当前highlightindex节点   
						completesVal.eq(highlightindex).css("background-color","#e8f4ff").css("color","#000000");   
					}   
					//向上键的控制   
					if(keyCode == 38){   
						if(highlightindex != -1){   
							completesVal.eq(highlightindex).css("background-color","white").css("color","#555555");   
							highlightindex--;   
						}   
						if(highlightindex ==-1){   
							highlightindex=completesVal.length;   
						}   
						//高亮当前highlightindex节点   
						completesVal.eq(highlightindex).css("background-color","#e8f4ff").css("color","#000000");   
					}   
  
					//enter键的控制   
					//1.按下enter键，把提示的值传给文本框   
					//2.关闭提示层   
					//3.提交   
					if(keyCode == '13'){
						event.preventDefault();
						if(highlightindex != -1){   
                    		//获取当前高亮值   
                    		var comsVal = completesVal.eq(highlightindex);   
							//给文本框赋值   
							Obj.val(comsVal.find('span').text());
							var Code = comsVal.attr("data");
							var CHNa = "Code_"+Obj.attr("name");
							var CHid = "Code_"+Obj.attr("id");
							if($("#"+CHid).size()==0){
								Obj.after('<input type="hidden" name="'+CHNa+'" value="'+Code+'" id="'+CHid+'" />');
							}
							$("#"+CHid).val(Code)
							//高亮索引回归到初始化   
							//highlightindex = -1;   
							//隐藏提示框   
							autoDiv.hide();
						}else{   
							//commitSearch();   
							//文本框失去焦点，不然按回车会不停的发出请求   
							Obj.get(0).blur();   
							autoDiv.hide();
						}
					}   
				}   
			});
			
		});
		document.onclick=function(e){
			$("[id="+settings.autoDID+"]").hide();
			highlightindex = -1;
			hideDv();
		};   
		//单击文档关闭提示层   
	};
		
	$.fn.autoCPT.defaults = {
			ClassName: 'CHtip', //弹出,消失时间延迟,ms为单位
			stationData : [] ,
			xOffset : 0,
			yOffset : 0,
			zindex  : 10,
			autoDID : 'autoDIV'

	};
});