﻿$(document).ready(function() {

    pointRow = -1; //用以获取和设置位置指标，全局变量

    $(document).keyup(function(event) {
        var len = $("#searchDiv p").length; //获取自动搜索的行数

        //键盘向上键触发的事件，向上键在keyCode中的代码为38
        if (event.keyCode == "38") {
            if (pointRow == -1) {
                pointRow = len - 1;
                $("#searchDiv p").eq(pointRow).css("background-color", "#e2eaff"); //如果是首次载入，向上键指向最后一行，背景色变化
                $("#keywords").val($("#searchDiv p").eq(pointRow).children("B").html()); //将选中的行的内容填充进搜索框
            }
            else {
                $("#searchDiv p").eq(pointRow).css("background-color", "#ffffff"); //去掉背景色
                if (pointRow == 0) pointRow = len - 1; else pointRow = pointRow - 1; //判断，如果到顶了，则跳到最后一行重新开始
                $("#searchDiv p").eq(pointRow).css("background-color", "#e2eaff"); //指向上一行数据
                $("#keywords").val($("#searchDiv p").eq(pointRow).children("B").html()); //并将选中的行的内容填充进搜索框
            }
        }

        //键盘向下键触发的事件，该键在keyCode中的代码为40
        if (event.keyCode == "40") {
            if (pointRow == -1) {
                pointRow = 0;
                $("#searchDiv p").eq(pointRow).css("background-color", "#e2eaff"); //如果是首次载入，向下键指向第一行，背景色变化
                $("#keywords").val($("#searchDiv p").eq(pointRow).children("B").html()); //将选中的行的内容填充进搜索框
            }
            else {
                $("#searchDiv p").eq(pointRow).css("background-color", "#ffffff"); //去掉背景色
                if (pointRow == len - 1) pointRow = 0; else pointRow = pointRow + 1; //判断，如果到尾了，则跳到第一行重新开始
                $("#searchDiv p").eq(pointRow).css("background-color", "#e2eaff"); //指向下一行数据
                $("#keywords").val($("#searchDiv p").eq(pointRow).children("B").html()); //并将选中的行的内容填充进搜索框
            }
        }

        $("body").click(function() {
            if ($("#searchDiv").html() != null) {
                $("#searchDiv").remove();
            }
        })
    })

    $("#sb_form_q").keyup(function(event) {


        if (event.keyCode != "38" && event.keyCode != "40")//排除向上和向下键，以避免跟Document的keyup起冲突
        {
            pointRow = -1; //这句话很重要，重置pointRow的值，因此当keywords中的搜索内容改变时，不会使用上次的pointRow脏数据

            //下面这段话用以设置搜索结果的信息框的位置，它紧贴在keywords这个查找框的下面，形成一个下拉的假象 
            $("#searchDiv").remove();
            var leftS = $(this).offset().left;
            var topS = 72; // $(this).offset().top + $(this).height() + 4 + 3;
            var widthS = 330;   //$(this).width()+2;

            //开始执行查找结果的载入
            if ($(this).val() != "") {
                var waiting = "<img src='./images/loading.gif'/>&nbsp;&nbsp;数据载入中！"; //这边设置延迟载入的内容
                searchDiv(leftS, topS, widthS, waiting); //加载显示一个延迟框

                var selectLanguage = '<% =selectedLanguage %>';

                $.ajax({ //利用Ajax调用Web服务中的数据，实现与后台交互
                    type: "POST",
                    contentType: "application/json;utf-8",
                    url: "./WebService.asmx/GetData",
                     data: "{searchStr:'" + $(this).val() + "'}",
             //       data: "{searchStr:'" + $(this).val() + "',selectLanguage:'" + selectLanguage + "'}",
                    dataType: 'json',
                    anysc: false,
                    success: function(data) {
                        //XmlHttpRequest向服务器发送请求，并将获取最终的数据



                        if (data.d != "") {
                            setTimeout(function() { //为了显示延迟效果，这边故意自己设置了0.3秒的延迟，0.3秒结束后，将后台的数据载入，替代了信息延迟提示框的内容...
                                $("#searchDiv").remove(); //去除信息延迟提示框
                                searchDiv(leftS, topS, widthS, data.d); //加载最终从后台提取的内容
                            }, 1);

                            //                            $("#searchDiv").remove(); //去除信息延迟提示框
                            //                            searchDiv(leftS, topS, widthS, data.d); //加载最终从后台提取的内容
                        }
                        else $("#searchDiv").remove();
                    }
                })
            }
            else $("#searchDiv").remove();
        }
    })

})


//鼠标经过函数
function sel(ids)
{
    $("#" + ids).css("background-color", "#e2eaff");    // #e2eaff
}

//鼠标离开函数
function unsel(ids)
{
    $("#" + ids).css("background-color", "#ffffff");   //#ffffff
}

//查找结果函数
function searchDiv(leftS,topS,widthS,dataS)
{
     var popDiv="<div id='searchDiv'>"+dataS+"</div>";
     $('body').append(popDiv);
     $("#searchDiv").css({"left":leftS,"top":topS,"width":widthS,"height":"auto"});
}

//鼠标点击时执行的事件
function clickS(ids)
{
  //  $("#keywords").val($("#"+ids).html());
    $("#searchDiv").remove();
}
