我在页面中有几个这样的链接

<a href="{{ route('user_profile') }}"
   class="user-tooltip"
   data-uid="{{ $user->id }}>
    {{ $user->name }}
</a>

通过悬停链接，我会显示一个工具提示，其中包含用户的头像和一些信息 . 到目前为止，我为页面上的每个用户生成了一个不同的html工具提示作为页面加载，但是要显示的用户正在增长，我只想在需要时加载工具提示的信息 . 为此，我对服务器进行了一次AJAX调用，并将html标记代码放入工具提示中，但它不显示 .

这是绑定到链接的代码

$('.user-tooltip').tooltipster({
    interactive: true,
    content: 'Loading...',
    contentAsHTML: true,
    multiple:true,

    functionBefore: function(instance, helper) {
        var $origin = $(helper.origin);

        if ($origin.data('loaded') !== true) {
            $.get('https://localtest.mys/user-tooltip', 
                  {uid:$origin.data('uid')}, 
                  function(data) {
                        instance.content($(data));

                        $origin.data('loaded', true);
            });
        }
    }
});

当我悬停链接时，会显示包含 Loading... 消息的工具提示，一段时间后工具提示变为空 . 来自服务器的响应是正确的，我已经验证过，它是一个包含正确的html标签的字符串，但它不会在工具提示中呈现 .

我错过了什么？

工具提示：http://iamceege.github.io/tooltipster/

编辑：澄清一下，来自服务器的html放在工具提示中（分析我可以读取的元素），但它没有呈现 .

尝试使用委托，问题是一样的：

$('body').on('mouseenter', '.user-tooltip:not(.tooltipstered)', function(){
    $(this).tooltipster({
        interactive: true,
        content: 'Loading...',
        contentAsHTML: true,

        functionBefore: function(instance, helper) {
            let $origin = $(helper.origin);

            if ($origin.data('loaded') !== true) {
                $.get('https://localtest.mys/user-tooltip', {uid:$origin.data('uid')}, function(data) {
                    instance.content($(data));

                    $origin.data('loaded', true);
                });
            }
        }
    }).tooltipster('open');
});
javascript jquery ajax tooltipster