获取Bootstrap的预先输入的选定项目值

时间:2012-02-27 02:46:01

标签: jquery twitter-bootstrap typeahead

Bootstrap刚刚实现了一个名为typeahead的简洁自动完成功能。我无法获得文本输入的适当值。

例如,我可能会有以下内容:

$('input').on('change', function(){
    console.log($(this).val());
});

这似乎不会捕获所选值。有没有人知道如何使用带引导程序的typeahead获取所选值?

5 个答案:

答案 0 :(得分:42)

$('#autocomplete').on('typeahead:selected', function (e, datum) {
    console.log(datum);
});
$('#autocomplete').on('typeahead:cursorchanged', function (e, datum) {
    console.log(datum);
});

似乎Typeahead已更改的侦听器和用法没有详细记录。您可以使用这些监听器。

<强>更新

事件名称已更改为typeahead:在更高版本中选择。

答案 1 :(得分:7)

我正在使用这个,我现在遇到同样的问题。我打算用这个漂亮的叉子解决它

https://gist.github.com/1891669

我用回调做到了:

  $('.typeahead').typeahead({
    // note that "value" is the default setting for the property option
    source: [{value: 'Charlie'}, {value: 'Gudbergur'}, ...],
    onselect: function(obj) { console.log(obj) }
  })

希望它也能帮到你。

答案 2 :(得分:4)

如果您在页面上只有1,则可以尝试$('ul.typeahead li.active').data('value');但如果页面上的内容超过1,则可能会遇到问题。

我想知道输入值没有设置的原因是什么?

答案 3 :(得分:2)

$('#myselector').typeahead({
itemSelected:function(data,value,text){
   console.log(data)
    alert('value is'+value);
    alert('text is'+text);
},
//your other stuffs
});

您必须在回调函数中传递itemSelected,它将为您提供所选项目。

希望这对你有用。

答案 4 :(得分:0)

如果您使用其他按钮处理所选项目或需要在更新后立即获取此项目,则可以使用$("#your_input").next("ul").find("li.active").data("value");来获取您的价值。

为ajax bootstrap预先工作。