下拉提示(GoogleSuggest)

样式:  

<style type="text/css">

.autocomplete{width:200px;border:1px solid #999;background:white;position:absolute;overflow:hidden; list-style-type:none; padding-left:0;margin-left:0px; margin-top:0;}

    </style>


JS:(Jquery)

<script type="text/javascript" language="javascript">
    var $autocomplete = $("<ul class='autocomplete'></ul>").hide().insertAfter("#<%=search.ClientID %>");
    $("#<%=search.ClientID %>").keyup(function () {

        $.post("Handler.ashx", { "searchText": $("#<%=search.ClientID %>").val() }, function (data) {

            if (data.length) {
                $autocomplete.empty();

                var arr = data.substring(0, data.length - 1).split(',');
                $.each(arr, function (index, term) {
                    $("<li></li>").text(term).appendTo($autocomplete).mouseover(function () {
                        $(this).css("background", "green");
                    }).mouseout(function () {
                        $(this).css("background", "white");
                    })
                          .click(function () {
                              $("#<%=search.ClientID %>").val(term);
                              $autocomplete.hide();
                          });
                });
                $autocomplete.show();
            }

        });
    }).blur(function () {
        setTimeout(function () {
            $autocomplete.hide();
        }, 500);

    });
          </script>


AjAx:

public void ProcessRequest (HttpContext context) {
        BLL.Hotel bHotel = new BLL.Hotel();
        context.Response.ContentType = "text/plain";
        string teststr = context.Request.Form["searchText"];
        DataTable dt = bHotel.GetHotelName(teststr).Tables[0];
        string str = null;
        for (int i = 0; i < dt.Rows.Count; i++)
        {
            str += dt.Rows[i]["HotelName"]+",";
        }
        context.Response.Write(str);
    }


  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值