我正在尝试css
根据条件添加一个到列表项,如果一个列表项的label
文本包含+
我需要添加红色,否则我只需要添加黄色background-color。
我快到了,但是我不知道要执行dynamic data coming form server
什么open
功能。
代码:
$("#project").autocomplete({
minLength: 0,
source: function (request, response) {
//In success of ajax call i fill request(projects)
response(projects);
},
open: function (event, ui) {
var len = $('.ui-autocomplete > li').length;
//I can access projects here but i need filtered data list coming from server which is passed to response callback
$('.ui-autocomplete > li').css("background-color", "yellow");
for (var i = 0; i < len; i++) {
// Here i use indexof('+') on each list item's label text and apply css but how to get the list here ??
}
$('#count').html('Founded ' + len + ' results');
}
});
在这里检查小提琴
您可以将css
method与功能结合使用,以根据文本内容返回颜色:
open: function (event, ui) {
$('.ui-autocomplete > li').css("background-color", function() {
return $(this).text().indexOf('+') > -1 ? 'red' : 'yellow';
});
$('#count').html('Founded ' + len + ' results');
}
演示: http ://jsfiddle.net/DZ9zU/35/
我还建议设置一个类名,而不是内联css样式,这样在样式方面可以提供更好的灵活性。
open: function (event, ui) {
$('.ui-autocomplete > li:contains(+)').addClass('red');
$('#count').html('Founded ' + len + ' results');
}
使用CSS规则:
.ui-autocomplete > li {
background-color: yellow;
}
.ui-autocomplete > li.red {
background-color: red;
}
本文收集自互联网,转载请注明来源。
如有侵权,请联系 [email protected] 删除。
我来说两句