javascript - jQuery UI 自动完成 - 外部 javascript 数据源的语法？

Question

提前感谢您的阅读。我正在尝试自定义 jQuery UI 自动完成搜索以显示可单击链接的结果，并且我已经成功了。我已成功模仿此论坛上另一个问题的代码。

但是，我最终将有太多链接需要作为变量存储在页面上。我曾经使用旧版本的 jQuery 自动完成(在它成为 jQuery UI 之前)并且能够将变量“更新”存储在 JavaScript 文件中。对于新版本的 UI，我不知道该怎么做。旧版本在这里...

http://bassistance.de/jquery-plugins/jquery-plugin-autocomplete/

那里使用的 JavaScript 文件是“localdata.js”

有谁知道如何将源从同一 HTML 页面上的变量更改为外部 javascript 文件，该文件与 jQuery UI 版本中的变量具有完全相同的文本？？？

我还尝试了这里的迁移指南； http://www.learningjquery.com/2010/06/autocomplete-migration-guide但我无法弄清楚这一点。

我拥有的工作代码，不引用外部文件如下...

================================================== =====

    <script>
    $(function() {


    var updates = [ 

    { value: "http://www.google.com", label: "Google"},
    { value: "http://www.yahoo.com", label: "Yahoo!"},
    ];

    $("input#autocomplete").autocomplete({
    source: updates,
    select: function( event, ui ) { 
    window.location.href = ui.item.value;
    }
    });
    });
    </script>

========================================

我知道更改发生在“源；更新”行，但我不知道该怎么做。再次非常非常感谢您的阅读。

Answer 1

实现此目的的一种方法是以 JSON 格式将数据存储在单独的文件中。以您的示例为例，您可以将更新数组转换为有效的 JSON:

[{"value": "http://www.google.com", "label": "Google"},
 {"value": "http://www.yahoo.com", "label": "Yahoo!"}]

(请注意键和值周围的双引号，不需要变量)，然后将其保存在 update.json 文件中。通过此设置，您可以将自动完成中的source设置为updates.json:

$("input#autocomplete").autocomplete({
  source: "updates.json",
  select: function( event, ui ) { 
    window.location.href = ui.item.value;
  }
});

这假设您将从同一域提供文件(自动完成功能还支持通过 JSONP 从远程域调用)。