Bootstrap Typeahead仅允许列表值
是否可以将用户的选择限制为Bootstrap Typeahead项的预定义数据源项？ 因此，如果用户键入了不在数据源中的内容，则会显示一条消息，通知他们这样做？
这是演示： http ： //cruiseoutlook.com/test
如果我理解，当先行模式组件失去焦点时，如果用户不在列表中，则应提示用户输入无效？
因此代码将是这样的：
var myData = [...]; // This array will contain all your possible data for the typeahead $("#my-type-ahead").typeahead({source : myData}) .blur(validateSelection); function validateSelection() { if(source.indexOf($(this).val()) === -1) alert('Error : element not in list!'); } 请注意，在IE6-8中没有实现indexOf这一事实。 但是可以找到填充程序，例如： 查找项目是否在JavaScript数组中的最佳方法？ 。
我遇到了同样的问题，但在我的情况下，我的所有数据都是远程的 。 Bloodhound实际上没有任何好的钩子，我现在知道它可以让你这样做，但你可以挂钩到ajax完整回调并手动建立一个有效的输入缓存，然后检查更改/模糊。
var myData = new Bloodhound({ remote: { url: '/my/path/%QUERY.json', ajax: { complete: function(response){ response.responseJSON.forEach(function (item) { if (myData.valueCache.indexOf(item.value) === -1) { myData.valueCache.push(item.value); } }); } } } }); myData.valueCache = []; myData.initialize(); $('#artists .typeahead').typeahead(null, { source: myData.ttAdapter() }).bind('change blur', function () { if (myData.valueCache.indexOf($(this).val()) === -1) { $(this).val(''); } });
使用jquery和Samuel的解决方案我认为你将克服IE问题。 将validateSelecion函数更改为：
function validateSelection() { if ($.inArray($(this).val(), myData) === -1) alert('Error : element not in list!'); }
塞缪尔指出，剩下的就剩下了。
我解决了这个问题的方式略有不同 – 大部分时间你需要捕获建议选项的ID，发布到后续的Web服务调用等。
当typeahead异步调用开始时，我决定将隐藏字段清空，并将隐藏字段的值设置为自动完成或选定的typehead事件上的datum.id。
提交表单时，我只是检查隐藏字段是否有值，如果没有，则用户从未选择建议选项。
我通过基于typeahead字段的名称向它添加_id来命名隐藏字段，然后在onAutocompleted和onSelected函数中使用此代码
我通过添加：
.on('typeahead:selected', onAutocompleted) .on('typeahead:autocompleted', onSelected)
在将.typeaheadfunction添加到输入字段的代码中。
var n = $(this).attr('name')+'_id'; $('input[name="' + n + '"]').val(datum.id);
typeahead文档讨论了传递给自动完成和选定函数的三个参数，事件，基准和名称，但我从未看到过传递的名称，这就是我使用$（this）.attr的原因。 （’name’）获取字段名称的机制。