知道为啥这个 Jquery 自动完成功能不起作用吗？

Posted 2023-05-08

【中文标题】知道为啥这个 Jquery 自动完成功能不起作用吗？

【英文标题】：Any idea why this Jquery autocomplete is not working?知道为什么这个 Jquery 自动完成功能不起作用吗？

【发布时间】：2016-02-15 06:33:57

【问题描述】：

我发现的很多关于 jquery 的自动完成功能不起作用的问题似乎都与 JSON 不正确有关，但我只是尝试使用带有数组的简单示例来使其工作。我可以让它在一个新创建的文本文件中运行，但我需要让它在一个相当大的 asp.net 应用程序中运行（不幸的是，我从另一个开发人员那里接管了它，所以我没有设置它）。

 $(function() 
var availableTags = [
  "ActionScript",
  "AppleScript",
  "Asp",
  "BASIC",
  "C",
  "C++",
  "Clojure",
];
$( "#tags" ).autocomplete(
  source: availableTags
);

);

这是我非常简单的自动完成代码。如果我把它放在一个带有一些 html 和所需引用的文本文件中，它就会起作用。但是，如果我把同样的东西放在我的 asp.net 应用程序的文本框上，它就不起作用。我想知道它是否与css有关，因为当我将它放入文本文件并使用时

<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">

这行不通。那是 jqueryui.com 上的代码 当我将其更改为

<link rel="stylesheet" href="http://code.jquery.com/ui/1.11.4/themes/ui-lightness/jquery-ui.css">

确实如此。我假设有什么东西在干扰它……知道那可能是什么吗？此应用程序中已经有多个 css 表，我不太确定如何判断。

感谢您提供的任何帮助。如果有人甚至知道我可以检查什么，那将非常有帮助。

编辑：这是我正在使用的实际代码：

<div id="Question_5" class="question">
                        <asp:UpdatePanel runat="server" ID="Q51UP">
                            <ContentTemplate>
                                <asp:Label runat="server" ID="Q51Label"></asp:Label>
                                <label style="color: #D9534F">* </label>
                                <br />

                                <asp:TextBox ID="Q51TextBox" class="text-box MyStyleSheet" runat="server" Width="200%"></asp:TextBox>

                                    <br />
                                <asp:RequiredFieldValidator EnableClientScript="false" ID="v5" runat="server" ControlToValidate="Q51TextBox"
                                    ErrorMessage="Value Required!" InitialValue="" ForeColor="#d9534f" SetFocusOnError="true">
                                </asp:RequiredFieldValidator>
                                <div style="height: 0px;"></div>
                            </ContentTemplate>
                        </asp:UpdatePanel>
                    </div>

然后在我的javascript中：

var availableTutorials = [
               "ActionScript",
               "Boostrap",
               "C",
               "C++",
            ];
       $("#Q51Textbox").autocomplete(
                source: availableTutorials
       );

【问题讨论】：

我将两个样式表都插入了这个小提琴，没​​有任何问题。您的 ASP.NET 应用程序的控制台中是否有任何错误？ jsfiddle.net/dgautsch/tenjngrd

不，它运行良好，它就像一个没有附加自动完成功能的常规文本框。

在浏览器中检查文本框。我怀疑客户端的实际ID不是Q51Textbox

不确定您是否检查过。但这里有一个问题可能会帮助你弄清楚***.com/q/3842639/1385672

很好，它被称为 MainContent_Q51TextBox。非常感谢先生！

【参考方案1】：

你有一个错字：

<asp:TextBox ID="Q51TextBox"....

在您的 js 中，您使用以下命令调用 TextBox id：

$("#Q51Textbox")（将'box'中的'b'改成小写）