jQuery文本框自动填充未显示

时间:2015-04-22 12:07:52

标签: jquery html autocomplete

我是HTML和jQuery的新手。最近,我正在尝试jQuery的自动完成功能,如here。除了style.css文件之外,我使用了给定的源代码。到现在为止,

  1. 当我使用Sublime Text 2并在Chrome中预览时,不会显示自动完成功能。
  2. 使用stackoverflow提供的代码段中的代码时,它可以正常工作。
  3. 怎么回事?

    谢谢。

    <!doctype html>
    <html lang="en">
    <head>
      <meta charset="utf-8">
      <title>jQuery UI Autocomplete - Default functionality</title>
      <link rel="stylesheet" href="//code.jquery.com/ui/1.11.4/themes/smoothness/jquery-ui.css">
      <script src="//code.jquery.com/jquery-1.10.2.js"></script>
      <script src="//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>
      <script>
      $(function() {
        var availableTags = [
          "ActionScript",
          "AppleScript",
          "Asp",
          "BASIC",
          "C",
          "C++",
          "Clojure",
          "COBOL",
          "ColdFusion",
          "Erlang",
          "Fortran",
          "Groovy",
          "Haskell",
          "Java",
          "JavaScript",
          "Lisp",
          "Perl",
          "PHP",
          "Python",
          "Ruby",
          "Scala",
          "Scheme"
        ];
        $( "#tags" ).autocomplete({
          source: availableTags
        });
      });
      </script>
    </head>
    <body>
     
    <div class="ui-widget">
      <label for="tags">Tags: </label>
      <input id="tags">
    </div>
     
     
    </body>
    </html>

2 个答案:

答案 0 :(得分:0)

您需要在localhost服务器上运行该文件。如果您只是在chrome中打开html文件,它就无法连接到外部CSS和JS文件,也无法在文件中执行其他javascript。

我复制粘贴您的代码并将其放在我的Wamp服务器上,它似乎对我来说很好。

答案 1 :(得分:0)

1)检查控制台是否有错误

2)如果它抛出jquery未找到错误纠正路径

<script src="http://code.jquery.com/jquery-1.10.2.js"></script>
<script src="http//code.jquery.com/ui/1.11.4/jquery-ui.js"></script>