Bootstrap -在焦点上显示所有Typeahead项
Bootstrap -在焦点上显示所有Typeahead项
提问于 2012-10-11 04:07:15
当文本输入(id=“问题”)获得焦点时，我想显示所有的Typeahead项。我该怎么做呢？
Javascript：
function SetTypeahead() {
$("#Questions").typeahead({
minLength: 0,
source: [
"Q1?",
"Q2?",
"Q3?",
"@4?"
]
});
}回答 6
Stack Overflow用户
发布于 2012-12-19 08:13:39
从https://raw.github.com/michaelcox/bootstrap/6789648b36aedaa795f1f5f11b4da6ab869f7f17/js/bootstrap-typeahead.js获取最新的bootstrap typeahead插件v2.1.2
此更新将允许零值的minLength为typeahead启用show all
<input id="typeaheadField" name="typeaheadField" type="text" placeholder="Start Typing">
$("#typeaheadField").typeahead({
minLength: 0,
items: 9999,
source: ["Alabama","Alaska","Arizona","Arkansas","California","Colorado", "Oregon"]
});然后，您必须将onFocus事件附加到您的元素，因为它不是由插件定义的：
$("#typeaheadField").on('focus', $("#typeaheadField").typeahead.bind($("#typeaheadField"), 'lookup'));这也是一个好主意，在本地重写bootstrap typeahead类，为结果设置max-height和垂直滚动，以防结果太多。
.typeahead {
max-height: 200px;
overflow-y: auto;
overflow-x: hidden;
}Stack Overflow用户
发布于 2017-02-21 02:35:09
对我来说，$viewValue在选择时为空，这阻止了列表的显示。我的解决方案是在$viewValue为null时将过滤器设置为空字符串。
<input type="text"
ng-model="gear.Value"
uib-typeahead="gear as gear.Name for gear in gears | filter:$viewValue || ''"
typeahead-show-hint="true"
typeahead-min-length="0"
typeahead-show-hint="true"
typeahead-editable='false'
typeahead-focus-first='false'
class="form-control"
name="gear"
ng-required="true"/>Stack Overflow用户
发布于 2020-12-12 14:36:00
对我来说，工作代码如下所示：
var typeHeadField = $("#typeaheadField");
typeHeadField.typeahead({
minLength: 0,
items: 9999,
source: ["Alabama","Alaska","Arizona","Arkansas","California","Colorado", "Oregon"]
});
typeHeadField.on('focus', function() {
$(this).trigger('propertychange');
});换句话说，只要在你想要的事件上触发事件'propertychange'即可。此时将打开Typehead自动完成功能。
页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/12827483
复制相关文章
相似问题
腾讯云开发者
