时间戳

首页 > 解决方案 > AJAX 成功后在 tooltipster 中更新 html 内容

javascript - AJAX 成功后在 tooltipster 中更新 html 内容

问题描述

我在单击触发器图标时打开的工具提示器中有交互式 html 内容。通过 AJAX 提交数据后，我希望将工具提示的内容替换为返回的data. 虽然显示了返回的数据，但工具提示此时已关闭，并且仅在将鼠标悬停在原始打开触发器上时才可见。

这是我的工具提示器的 jQuery：

$(document).ready(function() {
    $(".layout-save").click(function(e) {
        e.preventDefault();     
        var form = $(".image_define");
        var params = form.serializeArray();
        var formData = new FormData();
        formData.append('default_image', $('#default_image')[0].files[0]);

        $(params).each(function (index, element) {
            formData.append(element.name, element.value);
        });

        $.ajax({
            url: form.attr('action'),
            method: "post",
            data: formData,
            contentType: false,
            processData: false
        })
        .done(function(data) {
            $('.tooltip-imageHandler-<?php echo $products_filter; ?>').tooltipster('destroy');
            $('.tooltip-imageHandler-<?php echo $products_filter; ?>').tooltipster({ 
                content: data,
                contentAsHTML: 'true'
            });
        })
        .fail(function() {
            alert('Ajax Submit for New Image Save Failed ...'); 
        });
    });
});

我认为它.tooltipster('destroy')正在关闭工具提示，但是如果我尝试在不destroy先使用的情况下替换内容，我会收到一条错误消息

Tooltipster：一个或多个工具提示已附加到下面的元素。无视。

是否可以在不关闭工具提示器的情况下替换我的内容？

标签： javascriptjquerytooltipster

解决方案

尝试这个：

$('.tooltip-imageHandler-<?php echo $products_filter; ?>').tooltipster('update', data);

推荐阅读