使用 jQuery 的 Ajax 自动完成答案

【问题标题】：Ajax Autocomplete using jQuery使用 jQuery 的 Ajax 自动完成
【发布时间】：2012-01-24 16:57:54
【问题描述】：

我有以下代码从 db 中检索部门名称我在格式化背景和字体颜色等数据的 CSS 时遇到问题

<script type="text/jscript">
    $(document).ready(function() {

$.ajax({
    type: "POST",
    url: "/AjaxLoad.asmx/GetBrands",
    dataType: "json",
    data: "{}",
    contentType: "application/json; charset=utf-8",
    success: function(data) {
        var datafromServer = data.d.split(":");
        $("[id$='tbBrands']").autocomplete({
            source: datafromServer
        });
    },
    error: function(XMLHttpRequest, textStatus, errorThrown) {
       alert(textStatus);
    }
});

}
</script>

<div id="ajaxbrands">
    <input id="tbBrands" runat="server" />
</div>

知道如何向每个列表项添加文本，例如 <p > 或 <div>？

【问题讨论】：

您是否查看了the .jQuery example 以了解如何执行此操作？您只需在服务器 (PHP) 响应中返回您想要的列表项。

标签： c# php jquery asp.net-ajax

【解决方案1】：

我可以考虑 2 个选项：

1.将其添加到您的 php 代码中（如 rdlowrey aadvised），例如：

$query = mysql_query("SELECT * FROM brands");
while($brand = mysql_fetch_array($query))
{
 echo "<p>".$brand['name']."</p>";
}

2.使用jquery来做。 “拆分”将您的字符串转换为子字符串数组。您应该编辑自动完成功能，以便它将每个子字符串添加到所需的代码。添加函数代码以获得更多帮助。

【讨论】：

【解决方案2】：

好吧，我假设您使用的是 .NET，所以，我不会乱用服务器端代码。您可以将其添加到您的成功回调函数中：

success: function(data) {
        var datafromServer = data.d.split(":");

        for(var item in datafromServer){
           datafromServer[item] = '<p class="whatever">' + datafromServer[item] + '</p>';
        }

        $("[id$='tbBrands']").autocomplete({
            source: datafromServer
        });
    },

添加的 for 循环将围绕数组中的每个项目，使用 p 或 div 或其他任何内容。

【讨论】：