我在我的网站上使用'simple tip'jQuery工具提示代码,它在索引页面上正常工作但不在我通过AJAX加载的外部页面上工作。
请在此处查看实时示例(已删除 - 不再有效)。您将看到它正在处理类别图标,但不会在下面的框中的5个图像上工作。虽然它可以在您独立加载此内容时起作用。 (/featured.html)
我在这里搜索了关于在AJAX加载页面上使用jQuery的主题,我看到有人提到:
.live()
但我只是不知道如何将其实现到工具提示代码中,如下所示:
function simple_tooltip(target_items, name){
$(target_items).each(function(i){
$("body").append("<div class='"+name+"' id='"+name+i+"'><p>"+$(this).attr('title')+"</p></div>");
var my_tooltip = $("#"+name+i);
if($(this).attr("title") != ""){ // checks if there is a title
$(this).removeAttr("title").mouseover(function(){
my_tooltip.css({opacity:0.8, display:"none"}).fadeIn(50);
}).mousemove(function(kmouse){
my_tooltip.css({left:kmouse.pageX-15, top:kmouse.pageY+30});
}).mouseout(function(){
my_tooltip.fadeOut(50);
});
}
});
}
$(document).ready(function(){
simple_tooltip("a","tooltip");
});
有人能够指出我正确的方向吗?
提前致谢!
答案 0 :(得分:1)
我想,在使用ajax加载内容后再次绑定简单的工具提示就可以了。
$("#youdDiv").load("serverpage.php",function(){
simple_tooltip("a","tooltip");
});