Javascript 在twitter引导Typeahead中处理所选事件?
我想在用户使用TwitterBootstrap Typeahead选择一个值之后运行Javascript函数Javascript 在twitter引导Typeahead中处理所选事件?,javascript,jquery,twitter-bootstrap,events,jquery-events,Javascript,Jquery,Twitter Bootstrap,Events,Jquery Events,我想在用户使用TwitterBootstrap Typeahead选择一个值之后运行Javascript函数 我搜索了一些东西,比如所选事件。我第一次在这里发布答案,很多次我都在这里找到了答案,所以这里是我的贡献,希望能有所帮助。您应该能够检测到更改-请尝试以下操作: function bob(result) { alert('hi bob, you typed: '+ result); } $('#myTypeAhead').change(function(){ var re
我搜索了一些东西,比如所选事件。我第一次在这里发布答案,很多次我都在这里找到了答案,所以这里是我的贡献,希望能有所帮助。您应该能够检测到更改-请尝试以下操作:
function bob(result) {
alert('hi bob, you typed: '+ result);
}
$('#myTypeAhead').change(function(){
var result = $(this).val()
//call your function here
bob(result);
});
我创建了一个包含该功能的扩展
有关typeahead的工作方式的说明,请参见以下代码示例: HTML输入字段:
<input type="text" id="my-input-field" value="" />
说明:
您的输入字段设置为typeahead字段,第一行:$'my-input-field'。typeahead
当输入文本时,它触发source:选项以获取JSON列表并将其显示给用户。
如果用户单击某个项目或使用光标键选择该项目并输入,则会运行updater:选项。请注意,它尚未使用选定的值更新文本字段。
您可以使用item变量获取所选项目,并对其执行所需操作,例如myOwnFunctionitem。
我已经包括了一个创建对输入字段本身$fld的引用的示例,以防您想对它做些什么。请注意,不能使用$this引用字段。
然后必须包括行退货项目;在updater:选项中,因此输入字段实际上是用item变量更新的。
根据他们的观点,处理所选事件的正确方法是使用此事件处理程序:
$('#selector').on('typeahead:select', function(evt, item) {
console.log(evt)
console.log(item)
// Your Code Here
})
链接现在断开了。这是存储库吗?抱歉,我刚才更新了该链接,截至4月29日,该链接有效。链接至:True answer不是所选的答案,但…:已标记,因为这不是在typeahead上处理所选元素的受支持或建议的方法,请参见此处:at:typeahead:selected此方法不适用于twitter引导。typeahead现在与TwitterBootstrapis分离了,有没有办法按下这个处理程序的键?evt var似乎没有“which”属性
<input type="text" id="my-input-field" value="" />
$('#my-input-field').typeahead({
source: function (query, process) {
return $.get('json-page.json', { query: query }, function (data) {
return process(data.options);
});
},
updater: function(item) {
myOwnFunction(item);
var $fld = $('#my-input-field');
return item;
}
})
$('#selector').on('typeahead:select', function(evt, item) {
console.log(evt)
console.log(item)
// Your Code Here
})
source: function (query, process) {
return $.get(
url,
{ query: query },
function (data) {
limit: 10,
data = $.parseJSON(data);
return process(data);
}
);
},
afterSelect: function(item) {
$("#divId").val(item.id);
$("#divId").val(item.name);
}