Question

我有一个内置在Bootstrap v3.1.0中的网站，里面有一个文本输入字段。我想对它应用自动完成功能，但无法使Typeahead.js正常工作！

当我输入内容时，我没有自动完成！

查看代码：

@Html.TextBoxFor(x => x.Manufacturer, new { @class = "form-control manufacturer" })
@Html.ValidationMessageFor(x => x.Manufacturer)

JS代码

$(function() {
    $('.manufacturer').typeahead(null,
        {
            name: 'manufacturers',
            local: ["Audi",
                    "BMW",
                    "Vauxhall",
                    "Toyota"
                   ]
        });
});

我做错了什么？我还在我的输入字段中添加了autocomplete="off"，但仍然没有做任何事情。我还确保正在加载所有脚本。

Answer 1

似乎如果你使用twitter类型的'HEAD'，你的示例中有点落后于曲线。

var cars = new Bloodhound({
  datumTokenizer: function (d) {
      return Bloodhound.tokenizers.whitespace(d.car);
  },
  queryTokenizer: Bloodhound.tokenizers.whitespace,
  local: [{
      car: "Audi"
  }, {
      car: "BMW"
  }, {
      car: "Vauxhall"
  }, {
      car: "Toyota"
  }]
});

$(function () {
    cars.initialize();
    $('.manufacturer').typeahead(null, {
        name: 'manufacturers',
        displayKey: 'car',
        source: cars.ttAdapter()
    });
});

也是行动中的小提琴：http://jsfiddle.net/Mutmatt/7jxRy/

大部分信息都可以在http://twitter.github.io/typeahead.js/examples/和https://github.com/twitter/typeahead.js

找到

具有Typeahead的Bootstrap 3.1.0

1 个答案: