Jquery ajax和qtip动态内容

我有一个jquery ajax调用，我需要将结果变成qtip。 我的Ajax调用（到umbraco基地）

jQuery("div.videoCardBack").mouseover(function (e) { var getFormUrl = "/base/Popup/GetSessionPopup/" + this.id; $.ajax({ url: getFormUrl, success: function (data) { var result = eval("(" + data + ")"); $("#test").html("
 
" + result[0].SessionTitle + ' ' + result[0].SessionCode + ' ' + result[0].SessionDateTime + result[0].SessionAbstract); var o = { left: e.pageX - 180, top: e.pageY - 80 }; $("#test").show(2000).offset(o); } }); }); The qtip $('#verttabpanel a[rel]').each(function() { $(this).qtip( { content: { text: '', url: $(this).attr('rel'), title: { text: 'TechReadyTV2 - ' + $(this).attr('alt'), } }, position: { corner: { target: 'bottomMiddle', tooltip: 'topMiddle' }, adjust: { screen: true } }, show: { delay: 900, when: 'mouseover', solo: true }, hide: 'mouseout', style: { tip: true, border: { width: 0, radius: 4 }, name: 'dark', width: 570 } }) }); }); 

Answer 1

根据要用数据填充的qtip的哪个实例，您可以执行以下操作：

 jQuery("div.videoCardBack").mouseover(function (e) { var getFormUrl = "/base/Popup/GetSessionPopup/" + this.id; $.ajax({ url: getFormUrl, success: function (data) { var result = eval("(" + data + ")"); $("#test").html("
 
" + result[0].SessionTitle + ' ' + result[0].SessionCode + ' ' + result[0].SessionDateTime + result[0].SessionAbstract); var o = { left: e.pageX - 180, top: e.pageY - 80 }; $("#test").show(2000).offset(o); var qtipAPI = $('#verttabpanel a[rel]').qtip("api"); qtipAPI.updateContent($("#test").html()); } }); }); 

var qtipAPI = $('#verttabpanel a[rel]').qtip("api"); 将获取对您最初绑定它的实例的qtip api的引用。 获得api引用后，您可以调用updateContent函数以使用您想要的任何内容更新qtip的主体。

Answer 2

以下是我为将动态创建的每个新图像元素添加qTip所做的工作。

我把它放在页面标题上。

 function call_qtip(element){ $(element).qtip({ content: { text: function(api) { return $(this).attr('qtip-content'); } }, position: { my: 'top left', at: 'bottom center', adjust: { y: 5 } }, style: { classes: 'ui-tooltip-tipsy' }, show: { when: { event: 'focus' }, effect: function() { $(this).fadeIn(500); } } }); } call_qtip('.tooltipped'); 

现在，页面中具有工具tooltipped类的每个元素都将转换为qTip。

最后，每次创建新元素时，我都会运行以下代码。

 call_qtip('#file_upload_uploaded img:last'); 

希望这有助于有人阅读这个问题！