[英]How to add an html element in JQuery UI Autocomplete?
我最近使用了 Jquery UI 自动完成功能,想知道如何在列表顶部添加 header。
到目前为止,这是我的脚本:
$(document).ready(function() {
$('.search').autocomplete({
source: 'search.php',
minLength: 1,
select: function(event,ui) {
var postid = ui.item.id;
if(postid != '') {
location.href = "post/" + postid;
}
}
});
});
我想添加<span>Suggestions</span>
。
看起来您需要通过覆盖自动完成项的呈现方式将其添加为“类别”(请参阅: https://jqueryui.com/autocomplete/#categories )。 代码未经测试,但可能会让您走上正确的道路:
$('.search').autocomplete({
source: 'search.php',
minLength: 1,
select: function(event,ui) {
var postid = ui.item.id;
if (postid != '') {
location.href = "post/" + postid;
}
},
_create: function() {
this._super();
this.widget().menu( "option", "items", "> :not(.ui-autocomplete-category)" );
},
_renderMenu: function( ul, items ) {
var self = this;
// Add your unselectable "category"
ul.append( "<li class='ui-autocomplete-category'>SUGGESTIONS</li>" );
// Add your other items
$.each( items, function( index, item ) {
self._renderItem( ul, item );
});
});
});
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.