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

jQuery UI autocomplete - syntax for external javascript data source?

本文关键字:javascript 外部 数据源 语法 UI jQuery      更新时间:2023-09-26

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

然而,我最终会有太多的链接存储在页面上作为一个变量。我曾经使用旧版本的jQuery自动完成(在它成为jQuery UI之前),并且能够将变量"updates"存储在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>

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

我知道更改是在"source;updates"行,但是我不知道该怎么做。非常非常感谢大家的阅读

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

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

(请注意键和值周围的双引号,不需要变量),然后保存在更新中。json文件。有了这个设置,你就可以将自动完成中的source设置为updates.json:

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

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