javascript - 从ajax调用结果更新qtip内容

Question

我使用 qtip 在按钮单击事件上显示为

$.ajax({
    url: url,
    data: data,
    method: 'POST',
    success: function(data){
         var Table1 = data.tableName;
         var menu_content = '<div id="menu"><img src="download.png" />'+ Table1 +'</div>';
         $('#button1').qtip({
              content: 'menu_content',
              show: 'click',
              hide: 'click',
         });
    },
    error: function(er){}
});

这不起作用。

Answer 1

我不熟悉qtip，但我曾经遇到过similar challenge with tooltip .

您基本上想要彻底改变代码并将 AJAX 调用放入 qtip 回调中。如果我正确地假设 content 参数支持回调，则可能会这样做:

$('#button1').qtip({
    content: function() {
        // If this is already part of your DOM, select it. Otherwise, you
        // could create a new jQuery element and append it where you want
        // it in your document.            
        var $menu = $('div#menu');
        var $img= $('<img />').attr('src', 'download.png')
        $menu.append($img);

        $.ajax({
            url: url,
            data: data,
            method: 'POST',
            success: function(data){
                var $textSpan = $('<span />').text('data.tableName');
                $menu.append($textSpan);
            }
        });
    },
    show: 'click',
    hide: 'click',
});