jQuery自动完成功能仅显示结果中的图像

时间:2018-08-20 18:54:01

标签: jquery jquery-ui-autocomplete emoji

我只想显示图像而不显示图像+文本,但是当我在renderItem函数中删除span时,图像变得无法选择。

function qwe(val)
{
    return val.split(/ \s*/);
}

function extractLast(term)
{
    return qwe(term).pop();
}

$("#body").bind("keydown", function(event)
{
    if(event.keyCode === $.ui.keyCode.TAB && $(this).data("ui-autocomplete").menu.active)
    {
        event.preventDefault();
    }
})
.autocomplete(
{
    delay: 0,
    source: function(request, response)
    {
        if(extractLast(request.term).match(/:\s*/))
            $.post('/core/test_get.php', {tag: extractLast(request.term)}, response, "json");
        }
    },
    focus: function()
    {
        return false;
    },
    select: function(event, ui)
    {
        var str = this.value;
        var lastIndex = str.lastIndexOf(" ");

        str = str.substring(0, lastIndex);          

        this.value = str + ' ' + ui.item.value;

        return false;
    }
}).autocomplete('instance')._renderItem = function(ul, item)
{
    //return $('<li><div><img src="http://<?=$domain?>/emojis/' + item.name + '.' + item.ext + '" class="emoji_select"> <span>' + item.name + '</span></div></li>').appendTo(ul);
    return $('<li><div><img src="http://<?=$domain?>/emojis/' + item.name + '.' + item.ext + '" class="emoji_select" title="' + item.name + '"></div></li>').appendTo(ul);
};

<textarea name="body" id="body"></textarea>  

想法是用不和谐的样式创建表情符号自动完成列表,当用户键入“:”时,表情符号列表会出现,但是我无法仅显示带有代码的图像,只能显示带有文本的图像。

我不明白SPAN的使用方式,似乎应该只在其中输入文字,如果没有跨度,则无法选择自动完成列表。

问题是,如何在不使用跨度和文本的情况下(仅限img项目)选择列表。

有什么想法吗?

0 个答案:

没有答案