我使用popover插件显示悬停卡片,我使用ajax从文件中获取用户名数据。我使用的是以下代码:
jQ('.username').popover({
html : true,
trigger: 'manual',
placement: function (context, source) {
var position = jQ(source).position();
if (position.left > 515) {
return "left";
}
if (position.left < 515) {
return "right";
}
if (position.top < 110){
return "bottom";
}
return "top";
},
//delay: {show: 700},
content: function() {
// Get link where user hover the username.
var view_user_link = jQ(this).attr('href').split('/');
// Get userid.
var userid = view_user_link[2];
var login_userid = getCookie('userid');
if(global_hash.perm_view_profiles || login_userid == userid) {
// Sent AJAX request to get user information to show in hovercard.
if(!jQ('#content_'+userid).html()) {
var obj = this;
jQ.ajax({
type: 'POST',
url: '/register',
data: {'action':'show_hovercard', 'userid':userid},
success: function (response) {
// Show hovercard data into tooltip.
jQ('a.username').attr('title','');
jQ('#hover_card_content').append(response);
return jQ('#content_'+userid).html();
}
});
} else {
// If AJAX request already sent from the user on the same page then data get from the page.
jQ('a.username').attr('title','');
return jQ('#content_'+userid).html();
}
} else {
// If user does't permission to view another user profile then show title.
jQ('a.username').attr('title','View profile');
}
}
}).on("mouseenter", function() {
var _this = this;
setTimeout(function(){
jQ(_this).popover("show");
jQ(".popover").on("mouseleave", function () {
jQ('.username').popover('hide');
});
}, 400);
}).on("mouseleave", function() {
var _this = this;
setTimeout(function() {
if (!jQ(".popover:hover").length) {
if(!jQ(_this).is(':hover')) {
jQ(_this).popover('hide');
}
}
}, 200);
});请帮助我如何延迟弹出显示,因为它是第一次不显示数据悬停的用户名链接,因为我正在使用ajax获取数据
发布于 2017-05-24 17:32:47
在ajax调用外部声明一个变量,在success提要上启用要传递给popover的任何内容,在complete上启用包含内容的popover
var popOverContent;
$.getJSON("url?id=" + obj.id + ", function (data) {
popOverContent = BuildPopOverDataContent(data.Title, data.Description);
})
.always(function () {
EnableHelpPopOver(obj.id, popOverContent);
$(jqObjId).trigger("mouseover"); //This will trigger the popover to show
});
function BuildPopOverDataContent(Title, Description) {
return "<h2>Some Content</h2>";
}
function EnableHelpPopOver(container, popOverContent) {
var objId = "#" + container;
$(objId).popover({
html: true,
trigger: 'hover',
container: objId,
placement: 'top',
delay: {
show: "500",
hide: "100"
},
content: popOverContent
});
}https://stackoverflow.com/questions/25444858
复制相似问题