使用 Materialize 自动完成 - 文本而不是可选图像

Question

我正在使用 Materialise Autocomplete，我想知道是否有办法使用文本而不是“可选图像”。为什么？如果文本不是唯一的，那么用户将不知道选择哪一个。有可能选项是名字，可能有两个同名同姓的人。

输入我的问题时，我发现我不能在数据中使用重复条目

    data: {
        "Radek": myself,
        "Radek": some other Radek,
        "Radoslav": 'http://placehold.it/250x250'
    },

js fiddle example

Answer 1

当您查看 source 时，您会发现以下与图像相关的行：

autocompleteOption.append('<img src="'+ data[key] +'" class="right circle"><span>'+ key +'</span>');

和

var img = $el.find('img');
$el.html("<span>" + beforeMatch + "<span class='highlight'>" + matchText + "</span>" + afterMatch + "</span>");
$el.prepend(img);

这会阻止我们将 image-attribute 用于图像以外的任何内容。

我们可以插入这样的东西来欺骗 Materialize

"Radoslav": " style="display: none;">Inserted Text <br><span style="display: none`

但它只会被转换为文本，从而产生等同于

的选项

"Inserted Text Radoslav": none

所以遗憾的是，这里一无所获。

但是，如果您想插入 linebreak，您可以在

上使用此答案

使用 Materialize 自动完成 - 文本而不是可选图像

autocomplete with Materialize - text instead of optional image

autocomplete

materialize