<div id=‘DropList‘ style=‘height:150px;width:300px;z-index:999;background-color:white;border:1px solid;position:absolute;display:none;overflow:scroll‘></div>
<script type="text/javascript">
    var loupancityvalue="";
    $("#u_loupancity").bind("keyup", function () {
                var loupancity = $("#u_loupancity").val();
                if (loupancity != "" && loupancityvalue != loupancity) {
                    loupancityvalue = loupancity;
                    var x = $(this).offset().top;
                    var y = $(this).offset().left;
                    var h = $(this).height();
                    var w = $(this).width();
                    $("#DropList").css("top", x + h + "px").css("left", y + "px").css("width", w + "px");
                    $("#DropList").attr("name", $(this).attr("id"));
                    $.ajax({
                        type: "POST",
                        url: "/Business/LouPanManage/GetCityName.do",
                        data: { loupancity: loupancity },
                        success: function (data) {
                            $("#DropList").html(data);
                            $("#DropList").show();
                        }
                    })
                }
                else {
                    loupancityvalue = "";
                }
    })
    var loupannamevalue = "";
    $("#u_loupanname").live("keyup", function () {
        var loupanname = $("#u_loupanname").val();
        if (loupanname != "" && loupannamevalue != loupanname) {
            loupannamevalue = loupanname;
            var loupancity = $("#u_loupancity").val();
            var x = $(this).offset().top;
            var y = $(this).offset().left;
            var h = $(this).height();
            var w = $(this).width();
            $("#DropList").css("top", x + h + "px").css("left", y + "px").css("width", w + "px");
            $("#DropList").attr("name", $(this).attr("id"));
            $.ajax({
                type: "POST",
                url: "/Business/LouPanManage/GetLouPanName.do",
                data: { loupancity: loupancity, loupanname: loupanname },
                success: function (data) {
                    $("#DropList").html(data);
                    $("#DropList").show();
                }
            })
        }
        else {
            loupannamevalue = "";
        }
    })
    $("$li[name=‘listli‘]").live("click", function () {
        var id = $("#DropList").attr("name");
        $("#" + id).val($(this).html());
        if ($(this).attr("id") != undefined)
        {
            $("#loupanid").val($(this).attr("id"));
        }
        $("#DropList").hide();
    })
</script>
原文:http://www.cnblogs.com/xiguanjiandan/p/4024982.html