jQuery自动完成不从文本加载源

Posted 2023-05-09

【中文标题】jQuery自动完成不从文本加载源

【英文标题】：jQuery Autocomplete not loading source from text

【发布时间】：2014-03-29 21:15:10

【问题描述】：

我在获取 jQuery 脚本以读取我在文本文件中作为自动完成字段源的部件列表时遇到问题。到目前为止，这是我所拥有的：

<script>
$(function() 
    var coffeeParts = $.get("coffeeParts.txt");
    $( "#partName" ).autocomplete(
      minLength: 2,
      source: coffeeParts,
      select: function ( event, ui ) 
          $("#partNumber").text(ui.item.partNumber);
          $("#partDesc").text(ui.item.partDesc);
          if (ui.item.partSource == 1) 
              $("#partSource").html("<div class='ui-widget'><div class = 'ui-state-highlight ui-corner-all' style='margin=top:5px;'><p><span class='ui-icon ui-icon-alert' style='float: left; margin-right: 6px;'></span> Text to display</p></div></div>");
          
          else if (ui.item.partSource == 2) 
              $("#partSource").html("<div class='ui-widget'><div class = 'ui-state-highlight ui-corner-all' style='margin=top:5px;'><p><span class='ui-icon ui-icon-alert' style='float: left; margin-right: 6px;'></span> Text to display</p></div></div>");
          
          else 
              $("#partSource").html("<div class='ui-widget'><div class = 'ui-state-highlight ui-corner-all' style='margin=top:5px;'><p><span class='ui-icon ui-icon-alert' style='float: left; margin-right: 6px;'></span> Text to display</p></div></div>");
          
        
    );
)
</script>

零件文件的结构如下：

["label": "Part Name 1", "partNumber": "12345678", "partDesc": "Bla Bla Bla", "partSource": 1,"label": "Part Name 2", "partNumber": "12345678", "partDesc": "Bla Bla Bla", "partSource": 1]

当我运行该页面时，在我的自动完成输入框 (#partName) 中输入文本不会显示可能的选项列表。它似乎没有将 coffeeParts.txt 的内容放入 coffeeParts 变量中。我在这里做错了什么？

【参考方案1】：

转储coffeeParts 变量并通过“source”参数调用文件。它已经像 .get() 方法一样工作了。

$('#partName').autocomplete(
   minLength: 2,
   source: "coffeeParts.txt"
);

【讨论】：

所有这些都让我为这样一个简单的修复而疯狂。谢谢！

NP。如果在将来某个时候您需要从数据库中动态填充自动完成字段，您可以找到 here

的示例

如果我想使用 AJAX 调用和 JQuery CSV 作为我的源怎么办？这是我在完全动态源和上面的静态源之间的中间步骤。我尝试使用此处建议的解决方案 link，但没有填充自动完成字段。

您需要创建一个 php 文件，将该 csv 转换为用于自动完成的 JSON 字符串，然后通过源调用该 php 文件。请记住在文件末尾回显 JSON 字符串，以便自动完成功能可以读取它。