我正在创建一个jQuery弹出窗口,当用鼠标悬停在用户名上时,用AJAX显示用户信息。它有效,但只是第一次。如果我将鼠标移出并弹出消失,然后再次悬停在用户名上,则弹出窗口是空白的(似乎AJAX调用不会重复多次)。
有人可以说明原因吗?
编辑:新清理的代码(问题仍未解决,只是让代码更容易理解):$(function(){
var hideDelay = 300;
var currentID = 0;
var hideTimer = null;
var container = $('<div id="personPopupContainer">' + '</div>');
var displayPopup = function(){
currentID = $(this).attr('rel');
if (hideTimer != null) {
clearTimeout(hideTimer);
}
var position = $(this).offset();
container.css({
left: position.left + 90 + 'px',
top: position.top + 15 + 'px'
});
$.ajax({
type: 'GET',
url: '/process.cfm',
data: 'id=' + currentID,
success: function(data){
$('#personPopupContainer').html(data);
if ($(data).find('#personPopupResult').length) {
var text = $(data).find('#personPopupResult').html();
$('#personPopupContainer').html(text);
}
}
});
container.css('display', 'block');
}
var hidePopup = function(){
if (hideTimer) {
clearTimeout(hideTimer);
}
hideTimer = setTimeout(function(){
container.css('display', 'none');
}, hideDelay);
}
var allowPopupMouseover = function() {
if (hideTimer) {
clearTimeout(hideTimer);
}
}
$('body').append(container);
$('.personPopupTrigger').live('mouseover', displayPopup);
$('.personPopupTrigger').live('mouseout', hidePopup);
$('#personPopupContainer').mouseover(allowPopupMouseover);
$('#personPopupContainer').mouseout(hidePopup);
});