[英]Adding a Custom Class to jQuery UI's ui-autocomplete Combobox Div
如何向ui-autocomplete div添加自定义类? 我在我的页面上加载了多个自动完成小部件,并且他们的一些下拉菜单需要设置不同的样式,所以我不能只编辑ui-autocomplete类。 我正在使用jQuery UI组合框代码( http://jqueryui.com/autocomplete/#combobox ),并且通过更改该代码,我想在创建的ui-autocomplete div中添加一个类。
$("#auto").autocomplete({
source: ...
}).autocomplete( "widget" ).addClass( "your_custom_class" );
不好意思推迟了)。 看看下面的代码。
$(function () {
$("#auto").autocomplete({
source: ['aa', 'bb', 'cc', 'dd']
}).data("ui-autocomplete")._renderItem = function (ul, item) {
ul.addClass('customClass'); //Ul custom class here
return $("<li></li>")
.addClass(item.customClass) //item based custom class to li here
.append("<a href='#'>" + item.label + "</a>")
.data("ui-autocomplete-item", item)
.appendTo(ul);
};
});
只需使用classes
参数:
$("#auto").autocomplete({
classes: {
"ui-autocomplete": "your-custom-class",
},
...
});
这意味着无论jQuery UI应用ui-autocomplete
类,它都应该应用your-custom-class
。
这与任何jQuery UI小部件相关,而不仅仅是自动完成。 请参阅文档 。
使用此方法将自定义类添加到下拉框
_renderMenu: function( ul, items ) {
var that = this;
$.each( items, function( index, item ) {
that._renderItemData( ul, item );
});
$( ul ).find( "li:odd" ).addClass( "odd" );
}
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.