$.ajax()调用返回一个promise，这是一个代表异步操作的特殊JavaScript对象。我可以通过添加.done(function)来附加一个完成回调函数，所以一旦请求完成，我的回调函数就会被调用。回调函数将接收到的响应作为参数，你可以在上面的代码中看到，我将其命名为data。这将是我要放入popover的HTML内容。

但在我们获得弹窗之前，还有一个细节需要处理，以便给予用户一个良好的体验。回想一下之前添加的逻辑，如果用户在触发鼠标进入事件之后的一秒内将鼠标指针移出<span>，将触发取消弹窗的逻辑。同样的逻辑也需要应用于异步请求，所以我添加了第二个子句来放弃我的xhr请求对象（如果存在）

最后我使用在Ajax回调函数中传递给我的data参数来创建我的弹窗组件：

app/templates/base.html：显示弹窗

function(data) {    xhr = null;    elem.popover({        trigger: 'manual',        html: true,        animation: false,        container: elem,        content: data    }).popover('show');    flask_moment_render_all();}

弹出窗口的实际创建非常简单，Bootstrap的popover()函数完成设置所需的所有工作。 弹出窗口的选项作为参数给出。 我已经用manual触发模式，HTML内容，没有淡入淡出的动画（这样它就会更快地出现和消失）配置了这个弹出窗口，并且我已经将父元素设置为<span>元素本身，所以悬停行为通过继承扩展到弹出窗口。 最后，我将Ajax回调函数的data参数作为content参数的值。

popover()调用创建了一个弹窗组件，该组件也具有一个名为popover()的方法来显示弹窗。因此我不得不添加第二个popover('show')调用来将弹窗显示到页面中。

弹出窗口的内容包括第十二章中通过Flask-Moment插件生成的“最后访问”日期。 文档中提到，当通过Ajax添加新的Flask-Moment元素时，需要调用flask_moment_render_all()函数来适当地渲染这些元素。

现在剩下的就是完善鼠标移出事件处理程序上的删除弹出窗口逻辑。 如果用户将鼠标移出目标元素，该处理程序已经具有中止弹出操作的逻辑。 如果这些条件都不适用，那么这意味着弹出窗口当前显示并且用户正在离开target区域，所以在这种情况下，对目标元素的popover('destroy')调用将正确地执行移除和清理。

app/templates/base.html：销毁弹窗

function(event) {    // mouse out event handler    var elem = $(event.currentTarget);    if (timer) {        clearTimeout(timer);        timer = null;    }    else if (xhr) {        xhr.abort();        xhr = null;    }    else {        elem.popover('destroy');    }}