jQuery 示例代码的自动完成功能不起作用

Question

我在任何其他具有相同问题的问题中都找不到答案。我正在尝试使用 jQuery 自动完成功能，但它根本没有做任何事情：

$(function(){
    $("#pj-filter").change(function(){
        window.location.href = "?project_filter=" + $(this).val();
    });
    $("#user-filter").change(function(){
        window.location.href = "?project_filter=false&user_filter=" + $(this).val();
    });
    $("#add-task").click(function(e){
        Popup.loading();
        request("task_form", {}, function(response){
            Popup.finish();
            Popup.display(response);
            $("input#name").focus();
            $(".date-input").datepicker({ dateFormat: 'yy-mm-dd', firstDay: 1 });
            /*var projects = <?php echo json_encode($projects); ?>;
            $("#project").autocomplete({
                source: projects
            });*/
            var availableTags = [
                "ActionScript",
                "AppleScript",
                "Asp",
                "BASIC",
                "C",
                "C++",
                "Clojure",
                "COBOL",
                "ColdFusion",
                "Erlang",
                "Fortran",
                "Groovy",
                "Haskell",
                "Java",
                "JavaScript",
                "Lisp",
                "Perl",
                "PHP",
                "Python",
                "Ruby",
                "Scala",
                "Scheme"
            ];
            $( "#project" ).autocomplete({
                source: availableTags
            });
            $("#save-task").click(function(){
                Popup.loading();
                request("save_task", {
                    name: $("input#name").val(),
                    status: $("select#status").val(),
                    description: $("textarea#description").val(),
                    due_date: $("input#due_date").val(),
                    type: $("select#type").val(),
                    safeID: $("input#safeID").val(),
                    project: $("input#project").val()
                }, function(response){
                    window.location.reload();
                });
            });
        });
    });
});

代码来自 jQuery 主页上的示例。奇怪的是，如果我查看 Chrome:

中的代码

<input type="text" id="project" maxlength="64" value="" 
       class="ui-autocomplete-input" autocomplete="off">

输入有 class ui-autocomplete-input，但自动完成仍然不起作用。

我使用 jQuery 3.1.1 和 jQuery-UI 1.12.1 jsfiddle 中的相同代码工作正常： https://jsfiddle.net/yn1Lo5cm/

var availableTags = [
  "ActionScript",
  "AppleScript",
  "Asp",
  "BASIC",
  "C",
  "C++",
  "Clojure",
  "COBOL",
  "ColdFusion",
  "Erlang",
  "Fortran",
  "Groovy",
  "Haskell",
  "Java",
  "JavaScript",
  "Lisp",
  "Perl",
  "PHP",
  "Python",
  "Ruby",
  "Scala",
  "Scheme"
];
$("#project").autocomplete({
  source: availableTags
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.1.1/jquery.min.js"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.min.js"></script>
<input type="text" id="project" maxlength="64" value="" class="ui-autocomplete-input" autocomplete="off">

Answer 1

您已将自动完成设置为关闭尝试 <input type="text" id="project" maxlength="64" value="" class="ui-autocomplete-input" autocomplete="on">

Answer 2

我们可以非常确定代码没有问题。这里有一件事，自动完成 不起作用 是什么意思？你说的下面一行很有意思：

The input has the class ui-autocomplete-input, but still the autocomplete does not work.

要使其正常工作，我们需要 jqueryui css。

我这么说是因为 css 的 link 在 fiddle 中不存在。是这样吗？

编辑：

这里还有一点要注意：我相信自动完成 HTML 属性与浏览器自动完成以前使用的文本有关，与 jQueryui 功能无关。

jQuery 示例代码的自动完成功能不起作用

jQuery Autocomplete from example code not working

javascript

jquery

jquery-ui-autocomplete