C# AJAX点击文本框,从后台获取数据显示下拉列表(带有皮肤)

最新推荐文章于 2019-07-01 17:47:33 发布

皮卡丘打代码i

最新推荐文章于 2019-07-01 17:47:33 发布

阅读量1.5k

点赞数

文章标签： ajax c# 数据

本文链接：https://blog.csdn.net/qq_16536641/article/details/75258583

版权

    <script src="JS/jquery.ui.core.js"></script>
    <script src="JS/jquery.ui.position.js"></script>
    <script src="JS/jquery.ui.widget.js"></script>
    <script src="JS/jquery.ui.autocomplete.js"></script>
    <link href="Themes/excite-bike/jquery-ui-1.9.0.custom.css" rel="stylesheet" />
    <script type="text/javascript">

//附带的资源包，请到我的资源页去下载。
//请注意，ashx文件要放到JQueryComplete目录下
//导入顺序要跟文章相同
        $(document).ready(function ()
        {
            $.ajax(
                    {
                        type: "post",
                        url: "KeyValueHandler.ashx",
                        dataType: "text",
                        success: function (data) {
                            pArray = $.parseJSON(data);
                        },
                        complete: function () {
                            $("#txtCitys").autocomplete({
                                source: pArray,
                                select: function (event, ui) {
                                    //$("#txtCitys").val(ui.item.value);
                                    $("#txtCitys").val(ui.item.label);
                                    event.preventDefault();
                                }
                            });
                            $("#txtCitys").data("autocomplete")._renderItem = function (ul, item) {
                                return $("<li></li>")
                                .data("item.autocomplete", item)
                                .append("<a><table  style='width:300;'> <tr> <td align='left'>" + item.label + "</td> <td align='right' style='color:green;'>" + item.value + "</td> </tr> </table></a>")
                                .appendTo(ul);
                            };
                        }


                    });
        });


    </script>
<body>
 <input type="text" id="txtCitys" />
</body>