Javascript jqueryselect与图像
我正在使用jquery select2插件,这是我的第一个选择:Javascript jqueryselect与图像,javascript,jquery,select,dynamic,plugins,Javascript,Jquery,Select,Dynamic,Plugins,我正在使用jquery select2插件,这是我的第一个选择: $('#dropdown_users').select2({ placeholder: 'Search for a category', minimumInputLength: 2, allowClear: true, ajax: { url: "search.php", dataType: 'json',
$('#dropdown_users').select2({
placeholder: 'Search for a category',
minimumInputLength: 2,
allowClear: true,
ajax: {
url: "search.php",
dataType: 'json',
quietMillis: 100,
data: function (term, page) {
return {
term: term, //search term
page_limit: 20 // page size
};
},
results: function (data, page) {
return { results: data.results };
}
}
});
这是完美的工作,文本显示
不是我想在显示的文本中添加图像,我所做的是:
function format(state) {
if (!state.id) return state.text; // optgroup
return "<img class='flag' src='uploads/" + state.text.toLowerCase() + ".jpg'/>";
}
$('#dropdown_users').select2({
placeholder: 'Search for a category',
minimumInputLength: 2,
allowClear: true,
ajax: {
url: "search.php",
dataType: 'json',
quietMillis: 100,
data: function (term, page) {
return {
term: term, //search term
page_limit: 20 // page size
};
},
results: function (data, page) {
return { results: data.results };
}
},
formatResult: format,
formatSelection: format,
escapeMarkup: function(m) { return m; }
});
正在发生的事情:
图像显示正确
图像旁边的文本将消失
为什么??谁能帮我解决这个问题??你好 使用css增加选择的宽度
#dropdown_users{
width:300px !important;//some width which suits the size of the image and text
//float:left;
}
您还可以通过向两个元素添加span或Div包装来为图像和文本添加float left。您应该使用state.text并从format函数返回图像:
return '<img class="flag" src="uploads/' + state.text.toLowerCase() + '.jpg" />' + state.text;
有关我的参考,请参阅: