我为我的网站创建了很好的工具提示,但是当我用鼠标快速移动时,以及在数据被缓存之前,我遇到了一个问题。
情况如下:我从数据库创建动态工具提示。为此,我进行了 2 次 ajax 调用,创建了很多 dom 以获得我想要的内容等。函数一个一个地调用自己,但结果是在工具提示完全创建之前显示。
要触发显示,我使用一个:
$('a').live('mouseenter',function(){
BuildTooltip(this);
$('#tooltipdiv').css('visibility','visible');
});
我希望工具提示仅在 ajax 调用完成时显示,工具提示已完全创建并且不会与以前的或类似的东西重叠。ajax 被缓存时可以正常工作,但在没有缓存时不能正常工作。
我尝试使用 async:false,但它创建的冻结不太友好,工具提示重叠我尝试回调,但它似乎不像我想要的那样工作......或者我做错了。
欢迎任何帮助:)
编辑:
这是我的 BuildTooltip 函数的代码。但是它调用了其他函数,所有内容都在 400 行左右,我不会全部复制:(
function BuildTooltip(element){
$('#tooltipdiv').remove();
if(String(element).indexOf('dbitem.php?db=')!=-1){
url=String(element);
var db=url.substring(url.indexOf('=')+1,url.indexOf('&'));
$('body').append('<div class="" id="tooltipdiv"><div class="" id="uctt">\
<div class="" id="itemttheader"></div><span class="" id="nomitem">\
</span><div class="" id="imgitem"><img></img></div><div class="" id="type">\
</div></div><div id="cd"></div><div class="" id="armor"><span class="" id="minarmor">\
</span><span class="hash">-</span><span class="" id="maxarmor"></span> Armor</div><div class="" id="dmgweap">\
<span class="" id="min"></span><span class="hash">-</span><span class="" id="max"></span> Damage</div>\
<div class="" id="dmgweapnorm"><span class="" id="minmin"></span>\
<span class="hash">-</span><span class="" id="maxmin"></span><span class="hash">-</span><span class="" id="minmax"></span><span class="hash">-</span>\
<span class="" id="maxmax"></span> Damage</div><div class="" id="dpsnorm">\
<span class="" id="mindamagepersec"></span> <span class="hash">-</span> <span class="" id="maxdamagepersec">\
</span><p> Damage Per Second</p></div><div class="" id="dps"><span class="" id="damagepersec">\
</span><p> Damage Per Second</p></div><div class="" id="attackspeed"><span class="" id="aps">\
</span> Attacks Per Second</div><div class="" id="effect"></div><div class="" id="effectpsk">\
</div><span class="" id="slot"></span><div id="useless"></div><div id="set"><span></span><div id="part0" class="part"></div>\
<div id="part1" class="part"></div><div id="part2" class="part"></div><div id="part3" class="part"></div>\
<div id="part4" class="part"></div><div id="part5" class="part"></div></div><div class="" id="requiredlevel">Required level : \
<span class="" id="minlvl"></span></div><div class="" id="rewards">Rewards : \
<span class="" id="reward"></span></div><div class="" id="points">\
<span class="" id="point"></span> Points</div><div class="" id="durability">\
Durability : <span class="" id="duramin"></span><span class="hash">-</span><span class="" id="duramax">\
</span></div></div></div>');
var offset=$(element).offset();
request = $.ajax({
url: "getphp/gettooltip.php",
type: "GET",
data: {db : db, id : url.substring(url.lastIndexOf('=')+1)},
dataType: "JSON"
});
request.done(function(msg){
FillInTooltip(msg,db)
});
}
}
FillInTooltip 函数使用 ajax 的结果,对其进行格式化,将其包含在 div 中,如果结果匹配一个条件,它会调用另一个 ajax 等