定时器内增加1秒后的弹窗创建处理。通过ajax方式请求后台的 /info/<username>/popup 服务， done 中为请求成
功后的回调函数，用于创建 manual 模式的弹窗对象，该模式的弹窗对象可手工创建、销毁。
在鼠标移出函数中增加处理，若鼠标悬停在1秒内，则直接停止定时器；若鼠标悬停超过1秒，但是ajax通讯处理中，
则停止ajax通讯；若ajax通讯正常处理完成了，则将弹窗销毁。
$(function(){
let timer = null;
$('.user_popup').hover(
function(event) {
const elem = $(event.currentTarget);
timer = setTimeout(function() {
timer=null;
// ------弹出窗口实现代码------ //
}, 1000);
},
function(event) {
const elem = $(event.currentTarget);
if (timer) {
clearTimeout(timer);
timer=null;
}
}
)
})
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
$(function(){
let timer = null;
let xhr = null;
$('.user_popup').hover(
function(event) {
// 获取span元素
const elem = $(event.currentTarget);
// 创建定时器
timer = setTimeout(function() {
timer=null;
// 通讯后台，获取弹窗展示页面
xhr = $.ajax(
`/info/${elem.first().text().trim()}/popup`).done(
function(data){
xhr = null;
// 创建弹窗对象并展示
elem.popover({
trigger: 'manual',
html: true,
animation: false,
container: elem,
content: data
}).popover('show');
// 渲染通过Ajax添加新的Flask-Moment元素
flask_moment_render_all();
}
);
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
剩余17页未读，继续阅读
