我使用Twitter Bootstrap与Jquery。
我想使用TYPEAHEAD函数为textarea,我得到工作超级容易。
但我也需要它允许多个选择。
我想使用TYPEAHEAD函数为textarea,我得到工作超级容易。
但我也需要它允许多个选择。
我的意思是,在我从自动完成中选择一个单词后,它需要我回到textarea,然后有一个额外的空间,然后如果我再次打字,它让我再做一次。
这里是一个JS bin:http://jsbin.com/ewubuk/1/edit
(内部没有什么特别的)。
有一个简单的解决方案,允许多重选择with typeahead?如果是,如何?
提前致谢。
解决方法
编辑已经有一个拉关系:
https://github.com/twitter/bootstrap/pull/2007
您可以通过使用typeahead的代理来达到所需的行为:Demo (jsfiddle)
var $myTextarea = $('#myTextarea'); $('.typeahead').typeahead({ source: source,updater: function(item) { $myTextarea.append(item,' '); return ''; } });
我认为updater方法是为这种事情,你只是返回将显示的内容。
或者如果你真的想要一切都在同一个输入元素,你将不得不重写更多的方法,使它只匹配当前类型的元素:Demo (jsfiddle)
function extractor(query) { var result = /([^,]+)$/.exec(query); if(result && result[1]) return result[1].trim(); return ''; } $('.typeahead').typeahead({ source: source,updater: function(item) { return this.$element.val().replace(/[^,]*$/,'')+item+','; },matcher: function (item) { var tquery = extractor(this.query); if(!tquery) return false; return ~item.toLowerCase().indexOf(tquery.toLowerCase()) },Highlighter: function (item) { var query = extractor(this.query).replace(/[\-\[\]{}()*+?.,\\\^$|#\s]/g,'\\$&') return item.replace(new RegExp('(' + query + ')','ig'),function ($1,match) { return '<strong>' + match + '</strong>' }) } });
这一个不是白痴证明,因为你必须在特殊字符后面键入。