$(function()
{
	var thetextbox = null;
	var lastcity = null;
	var w;
	var selected = false;
	if($("#begin").val()=="")
		$("#begin").val("输入中文或拼音");
	if($("#trainstation").val()=="")
		$("#trainstation").val("输入中文或拼音");
	$("#end").val("输入中文或拼音");

	$("#trainstation, #begin, #end").keydown(function(event){
		var s=$(this).attr("id");
		var myEvent = event || window.event;
		var keyCode = myEvent.keyCode;
		if(keyCode==13)
		{
			if($("#city").css("display")=="block"){
			$("#"+s).val($(".city0").children("div:eq(1)").text());selected=true;
			$("#city").hide(); return false;
			}
			else
				return true;
		}
	})

	$("#trainstation, #begin, #end").keyup(function(event){
		var s=$(this).attr("id");
		var city=$(this).val();
		if(city.length==1)
		{
			city=city.toUpperCase();
		}
		else if (city.length>1)
		{
			var b=city.substr(0,1).toUpperCase();
			city=b+city.substr(1);
		}
		var myEvent = event || window.event;
		var keyCode = myEvent.keyCode;

		if(typeof(keyCode)=="undefined" || (keyCode>=48 && keyCode<=105) || (keyCode==8&&$("#"+s).val()!=""))
		{
			$.getJSON("ajax.php",{py:city}, function callback(json){
				if(json<1)
				{
					//$("#"+s).val("");
					//$("#city").hide();
				}
				else
				{
					$("#city").show();
					var wi=$("#"+s).offset();
					$("#city").css({'width':$("#"+s).width()+30+"px",'left':wi.left+1+"px",'top':wi.top+21+"px",'position':'absolute','z-index':'3','border':'1px solid','background':'#ffffff'}).empty();
					var iteme=json.msg;
					for(var i=0;i<=iteme.length-2;i++)
					{
						$("<div>").addClass("cit").css({'padding-top':'3px'}).attr({'id':'auto'+i}).height("20px").appendTo($("#city"));
						var reg=new RegExp(city,"i");
						var c=iteme[i].py.replace(reg,"<strong>"+city+"</strong>");
						$("<div>").css({'float':'left','width':'58%','font-size':'13px','height':'15px','line-height':'15px'}).html(c).appendTo($("#auto"+i));
						$("<div>").css({'float':'right','width':'38%','font-size':'13px','line-height':'15px'}).attr({'align':'right'}).text(iteme[i].cy).appendTo($("#auto"+i));
					}
					$(".cit").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide();/*alert(",mm");*/});
					$(".cit:even").addClass("city");
					$("#city").children("div:eq(0)").addClass("city0");// 默认选中第一个
				}
			});
		}
		else if(keyCode==8&&$("#"+s).val()=="")
		{
			$("#city").show();
			var wi=$("#"+s).offset();
			$("#city").css({'width':$("#"+s).width()+20+"px",'left':wi.left+1+"px",'top':wi.top+21+"px",'position':'absolute','z-index':'3','border':'1px solid'});
			$("#"+s).focus();
		}
		else if(keyCode==40)
		{
			$(".city0").next("div").addClass("city0");
			$(".city0").prev("div").removeClass("city0");
		}
		else if(keyCode==38)
		{
			$(".city0").prev("div").addClass("city0");
			$(".city0").next("div").removeClass("city0");
		}
		else if(keyCode==13)
		{
			if($("#city").css("display")=="block"){
			$("#"+s).val($(".city0").children("div:eq(1)").text());selected=true;
			$("#city").hide();
			return false;
			}
			else
				return true;
		}
		return false;
	})


	$("#trainstation, #begin, #end").blur(function(){
		if(!selected){
			if($("#city").css("display")=="block"){
				$(this).val($(".cit").children("div:eq(1)").text());selected=true;
			 if($(this).val().length==0){$(this).val("输入中文或拼音");}
			 $("#city").hide();
		}}

		var curid = $(this).attr("id");
		setTimeout(function() {if(curid === thetextbox) $("#city").hide(); thetextbox=null;}, 1);
		clearInterval(w);
		w=null;
	})

	function checkcity(){
		if(!selected)
		{
			curVal = $("#"+thetextbox).val();
			if(lastcity!=curVal)
			{
				$("#"+thetextbox).keyup();
				lastcity = curVal;
				//$("#debug").html(curVal);
			}
		}
	}

	$("#trainstation, #begin, #end").focus(function(){
		selected = false;
		thetextbox = $(this).attr("id");
		var s=$(this).attr("id");	// 取当前TEXTBOX的ID

		$("#city").show();	// 显示提示框
		var wi=$("#"+s).offset();	// 取当前输入框位置
		$("#city").css({'width':$("#"+s).width()+30+"px",'left':wi.left+1+"px",'top':wi.top+21+"px",'position':'absolute','z-index':'3','border':'1px solid','background':'#ffffff'}).text("");	// 设置提示框的大小位置，并清空内容

		if($("#"+thetextbox).val()=="输入中文或拼音")
			$("#"+thetextbox).val("");	// 清空当前输入框内容
		lastcity = $("#"+thetextbox).val();
		w=setInterval(checkcity,150);
		if($("#"+s).val()=="")	// 如果当前输入框内容为空
		{
			$("<div>").css({'width':'100%'}).attr({'id':'auto0'}).addClass("city").css({'padding-top':'3px'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).css({'padding-top':'3px'}).attr({'id':'auto1'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).addClass("city").attr({'id':'auto2'}).css({'padding-top':'3px'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).css({'padding-top':'3px'}).attr({'id':'auto3'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).addClass("city").attr({'id':'auto4'}).css({'padding-top':'3px'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).css({'padding-top':'3px'}).attr({'id':'auto5'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).addClass("city").attr({'id':'auto6'}).css({'padding-top':'3px'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).css({'padding-top':'3px'}).attr({'id':'auto7'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).addClass("city").attr({'id':'auto8'}).css({'padding-top':'3px'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
			$("<div>").css({'width':'100%'}).css({'padding-top':'3px'}).attr({'id':'auto9'}).height("20px").mousemove(function(){$(".ci").removeClass("ci");$(this).addClass("ci");}).mouseout(function(){$(this).removeClass("ci");}).mousedown(function(){$("#"+s).val($(".ci").children("div:eq(1)").text());selected=true;$("#city").hide()}).appendTo($("#city"));
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Zhengzhou").appendTo($("#auto0"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("郑州").appendTo($("#auto0"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Tianjin").appendTo($("#auto1"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("天津").appendTo($("#auto1"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Nanjing").appendTo($("#auto2"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("南京").appendTo($("#auto2"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Shenyang").appendTo($("#auto3"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("沈阳").appendTo($("#auto3"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Guangzhou").appendTo($("#auto4"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("广州").appendTo($("#auto4"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Beijing").appendTo($("#auto5"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("北京").appendTo($("#auto5"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Zhuzhou").appendTo($("#auto6"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("株洲").appendTo($("#auto6"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Shenzhen").appendTo($("#auto7"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("深圳").appendTo($("#auto7"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Haerbin").appendTo($("#auto8"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("哈尔滨").appendTo($("#auto8"))
$("<div>").css({'float':'left','font-size':'13px','width':'60%'}).text("Shanghai").appendTo($("#auto9"));
$("<div>").css({'float':'right','width':'38%','font-size':'13px'}).attr({'align':'right'}).text("上海").appendTo($("#auto9"))
		}
		else
			$(this).keyup();
		$("#city").children("div:eq(0)").addClass("city0") ;});

})