Question

我很难让Twitter Bootstrap的Typeahead工作。 Typeahead仅匹配输入的第一个字母。我在预先输入框中的结果类似于

n
n
n
N
N
n.

我的代码是

<%= text_field_tag :search, params[:search], "data-provide" => "typeahead", "data-source" => '["USA", "Canada","Mexico"]' %>

有人可以帮忙吗？

Answer 1

检查html中为数据源属性输出的引号组合。我在使用以下代码片段时遇到了同样的问题。

<input type="text" name="test" id="test" class="span2" data-provide="typeahead" 
data-items="4" data-source="['thisone','another','zzzz']">

更改为以下内容，我在其他示例中看到过，没有修复它

data-source="["thisone","another","zzzz"]"

但切换到属性值周围的单引号和可搜索元素的双引号修复它。 此作品。

data-source='["thisone","another","zzzz"]'

Answer 2

对于在使用源函数时遇到此问题的任何人（即对服务器的ajax调用）：

使用：

process(JSON.parse(data));

而不是：

process(data);

Answer 3

我刚试过你的代码，它对我有用。当我把引号改为这样的时候，我得到了你所遇到的问题：

"['USA', 'Canada','Mexico']"

我遇到了类似的问题，它与您的问题略有不同，但它可能对其他人有所帮助。发生在我身上的是我传递给typeahead的JSON被解释为一个字符数组。所以如果我通过了：

["USA", "Canada","Mexico"]

它将它解释为一个包含26个字符的数组，因此typeahead的结果是给我单个字符。

在我的情况下，这是因为我正在进行ajax调用而我没有将dataType设置为'json'。在你的情况下，这不是问题，但希望这会让你走向解决方案！

Answer 4

var data = "";
$.ajax({
        url: 'ajax/getdirverandpass.php',
        success: function (result) {
            data = JSON.parse(result);
        },
        async: false
});

 $("#nav-search-input").typeahead({source: data, updater: function (a) {
            $("#nav-search-input").focus();
            return a
}});

请使用此 JSON.parse（结果）;

Bootstrap Typeahead仅显示第一个字母

4 个答案: