呈现 AJAX 响应的 HTML

Question

我正在使用 Select2 AJAX 远程选项来获取数据：

$('#t').select2({
    ajax: {
        url: '../ajax/results.php',
        data: function (params) {
            return {
                search: params.term,
                page: params.page || 1
            };
        }
    }
});

到目前为止一切顺利，结果返回如下（请注意<small> 标签）：

{
    "results": [
        {
            "id": "1",
            "text": "Doe Joe, <small>Mr.</small>"
        },
        {
            "id": "2",
            "text": "Smith Anne, <small>Mrs.</small>"
        },
        {
            "id": "3",
            "text": "Rossi Mario, <small>Mr.</small>"
        },
        ...
     ],
     "pagination": {
         "more": false
     }
}

在<select> 中，<small> 标记按原样打印，而不是被解析。 Select2 docs says that HTML are not rendered 默认情况下，渲染结果必须包装在 jQuery 对象中才能工作，但没有给出更多示例。

所有涉及templateResult的例子，确实没有给出如何通过AJAX结果的反馈（即https://select2.org/dropdown#templating）

请帮忙？

Answer 1

templating example 是对的，我只需要将所有内容都包装在 <span> 标记中即可：

function formatItem (item) {
    if (!item.id) {
        return item.text;
    }
    return $('<span>' + item.text + '</span>');
}

$('#t').select2({
    ajax: {
        url: '../ajax/results.php',
        data: function (params) {
            return {
                search: params.term,
                page: params.page || 1
            };
        }
    },
    templateResult: formatItem,
    templateSelection: formatItem
});