Php 在XMLHttpRequest之后重新初始化jQuery
我正在侧边栏上使用Twitter引导的Popover功能。边栏会被抓取并每30秒重新加载一次内容。我正在起诉XMLHttpRequest,通过获取一个名为stats.php的文件来重新加载侧边栏的内容 以下代码是驻留在页面标题中的“刷新”代码Php 在XMLHttpRequest之后重新初始化jQuery,php,javascript,jquery,twitter-bootstrap,xmlhttprequest,Php,Javascript,Jquery,Twitter Bootstrap,Xmlhttprequest,我正在侧边栏上使用Twitter引导的Popover功能。边栏会被抓取并每30秒重新加载一次内容。我正在起诉XMLHttpRequest,通过获取一个名为stats.php的文件来重新加载侧边栏的内容 以下代码是驻留在页面标题中的“刷新”代码 function onIndexLoad() { setInterval(onTimerCallback, 30000); } function onTimerCallback() { var request = new XMLHttpReq
function onIndexLoad()
{
setInterval(onTimerCallback, 30000);
}
function onTimerCallback()
{
var request = new XMLHttpRequest();
request.onreadystatechange = function()
{
if (request.readyState == 4 && request.status == 200)
{
document.getElementById("stats").style.opacity = 0;
setTimeout(function() {
document.getElementById("stats").innerHTML = request.responseText;
document.getElementById("stats").style.opacity = 100;
}, 1000);
}
}
request.open("GET", "stats.php", true);
request.send();
}
上面的代码工作得很完美,但是,在重新加载#stats div之后,popover不再执行它应该执行的操作-弹出
popover代码位于foreach()循环中的stats.php中,因为我需要多个popover脚本,因为侧边栏上有多个popover
这是我的popover代码:
$(document).ready(function() {
$('a[rel=popover_$id]').popover({
placement:'right',
title:'$title',
content: $('#popover_content_$id').html()
});
});
$id
和$title
在从foreach()循环中提取时是动态的
如何修复它,以便在重新加载div后,popover函数将重新初始化
我也尝试过:
$("a[rel=popover_controller_$cid]").on("mouseover", function () {
$('a[rel=popover_$id]').popover({
placement:'right',
title:'$title',
content: $('#popover_content_$id').html()
});
});
.live
折旧。在委托中使用
试着这样做:
$('#stats').on("mouseenter", "a[rel=popover_controller_$cid]",function () {
$('a[rel=popover_$id]').popover({
placement:'right',
title:'$title',
content: $('#popover_content_$id').html()
});
});
这会将鼠标指针事件从#stats
委托给a[rel=popover\u controller\u$cid]
,并且由于该事件已委托,因此在替换#stats
内容时仍会触发
小心-您将在每个鼠标上方不断初始化popover。那可能很糟糕
当您这样做时,您应该使用jquery的ajax而不是原生xhr。它更容易和更跨浏览器
$.get('stats.php', function(d){
$('#stats').html(d);
};
--
在jquery中搜索.on()和.live()。这就是你要找的。我已经用新代码更新了我原来的帖子,但它不起作用。on函数只对初始化时定义的对象起作用。使用$(文档)。在(“单击”,“a[rel=popover\u controller\u$cid]”上,function(){…我添加了一个间隔(到您的帖子中)…有没有办法只刷新特定的div而不是整个页面。当前的间隔代码在刷新时几乎“冻结”更新整个页面直到加载为止。每30秒只替换一次#stats。这是页面的很大一部分吗?你可以像替换#stats一样替换任何div。在该div上放置一个id并替换该id。例如:$(“#test”).html(d)
我弄明白了。我有一个输入错误。你的代码工作得非常完美。再次感谢!但是有一件事让我很烦。重新加载#stats后,我必须将鼠标悬停在链接上以激活popover两次才能激活它。如果我将鼠标悬停在上面一次,它不会弹出。是的,因为一旦你将鼠标悬停在小部件上,但是widget不会启动,因为它在mouseenter上显示(已经发生)。修复它的方法是手动使其显示自己。查看api,看看它是否允许您这样做。仅在初始化它时执行一次(使用标志?)
$.get('stats.php', function(d){
$('#stats').html(d);
};
setInterval(function(){
$.get('stats.php', function(data) {
$('#stats').html(data);
});
}, 30000);