ASP.NET学习网|ASP.NET教程|ASP.NET MVC|ASP.NET 源码|VS2010教程|ASP.NET视频教程

suggest.js文件（在引入suggest.js文件前需要先引入jquery-1.4.2.min.js）：

$(function() {  
    var k = -1;  
    //给查询文本框绑定click keyup事件，进行这两个事件，自动查询数据  
    $("#FrmChangshang").bind('click keyup', function(event) {  
        //获取键盘操作事件代码  
        var keyc = event.keyCode || event.which || event.charCode;  
        //查询数据为空，或者键盘操作代码为上下移动键，不进行查询操作  
        if ($("#FrmChangshang").val().length > 0 && keyc != 38 && keyc != 40) {  
            $.ajax({  
            url: "SearchCompany.ashx",  
                //firefox下必须对cname的编码，否则取不到数据，转换为utf-8也可以  
                data: "cname=" + escape($("#FrmChangshang").val()),  
                type: "get",  
                cache: false,  
                dataType: "xml",  
                beforeSend: function(XMLHttpRequest) {  
                    //请求前，列表曾显示加载数据提示  
                    $("#name_table_body").append("<tr><td>数据加载中......</td></tr>");  
                },  
                success: function(data, textStatus) {  
                    //设置层样式  
                    divsOffset();  
                    //先清空列表  
                    $("#name_table_body").html("");  
                    //返回数据成功，添加到列表,并为创建的表格td添加相应属性  
                    $("content", data).each(function(i, domEle) {  
                        $("<tr></tr>").append($("<td></td>", {  
                            mouseout: function() {  
                                $(this).css({ "backgroundColor": "#ffffff", "font-size": "15px", "color": "#000000" });  
                            },  
                            mouseover: function(tdi) {  
                                return function() {  
                                    k = tdi; setStyle(k);  
                                    $("#FrmChangshang").val($(this).text());  
                                };  
                            } (i),  
                            style: "background-color:#FFFAFA;font-size:15px;border:0;" 
                        }  
                        ).append($(domEle).children("name").text())).appendTo("#name_table_body");  
                    });  
                },  
                complete: function(XMLHttpRequest, textStatus) {  
                    //请求完成！  
                },  
                error: function(XMLHttpRequest, textStatus, errorThrown) {  
                    //请求出错处理  
                    $("#name_table_body").html("").append("<tr><td >错误提示：出见异常！！！</td></tr>");  
                }  
            })  
        }  
    })  
    //用键盘上下键移动时，样式设置函数  
    function setStyle(num) {  
        $("#name_table_body").find("td").each(function(Tindex, TdomEle) {  
            if (Tindex == num) {  
                $(TdomEle).css({ "backgroundColor": "#3366cc", "font-size": "15px", "color": "#ffffff", "cursor": "pointer" });  
            }  
            else {  
                $(TdomEle).css({ "backgroundColor": "#ffffff", "font-size": "15px", "color": "#000000" });  
            }  
        });  
    }  
    //查询框失去焦点清除数据，并隐藏  
    $("#FrmChangshang").blur(function() {  
        $("#name_table_body").html("");  
        $("#popup").hide();  
    })  
    //获取键盘上下键，通过上下键移动获取选中数据，同时更改其样式  
    $("#FrmChangshang").keydown(function(event) {  
        var tBody = $("#name_table_body").find("td").get();  
        var keyc = event.keyCode || event.which || event.charCode;  
        if (tBody == null)  
            return;  
        if (keyc == 40) {  
            k++;  
            if (k >= tBody.length) {  
                k = 0;  
            }  
            $("#FrmChangshang").val(tBody[k].firstChild.nodeValue);  
        }  
        else if (keyc == 38) {  
            k--;  
            if (k <= -1) {  
                k = tBody.length - 1;  
            }  
            $("#FrmChangshang").val(tBody[k].firstChild.nodeValue);  
        }  
        setStyle(k);  
    });  
    //设置层样式及绝对坐标  
    function divsOffset() {  
        $("#popup").show();  
        var inputTop = $("#FrmChangshang").offset().top;  
        var inputLeft = $("#FrmChangshang").offset().left;  
        var inputHeight = $("#FrmChangshang").outerHeight();  
        var inputWidth = $("#FrmChangshang").width();  
        $("#name_table").width(inputWidth + 2);  
        $("#popup").css({ "top": (inputTop + inputHeight), "width": inputWidth + 2, "left": inputLeft, "position": "absolute", "border": "#817f82 1px solid" });  
    }  
}) 

(责任编辑：admin)