如果AJAX JSON响应显示正确的数据,如何显示隐藏的DIV?
问题描述:
我正在处理AJAX/jQuery通知脚本。
目前它在AJAX响应中每10秒重新调整一次整个fhtml格式的页面。
它返回的页面是我想要一个PHP页面只显示出应显示 项目(只显示有新的东西展现出来,像一个新的邮件消息或发表评论等项目。)如果AJAX JSON响应显示正确的数据,如何显示隐藏的DIV?
改变这个使用JSON而不是我的主页(父母)我会有每个通知项目的DIV,默认情况下,他们将被隐藏使用CSS 和JSON响应会告诉我应该取消隐藏哪些项目。
所以这是我的基本计划,下面是一些视觉模型代码。
JSON响应,只有10个可能的项目,它只会返回标记为1的项目(意思是显示该项目)
1可能不需要,因为我只显示项目是已经确认用PHP显示?
{"mail":"1", "friend_request":"1" , "comment":"1" , "photo_comment":"1"},
在主父页面会有DIV与CSS,使它们隐藏这样。 (仅4个项目的演示)
<style type="text/css">
#mail_notification{
display: none;
}
#friend_request_notification{
display: none;
}
#comment_notification{
display: none;
}
#photo_comment_notification{
display: none;
}
</style>
<div id="mail_notification"><a href="someurl.com/mail.php?id2424">New Mail</a></div>
<div id="friend_request_notification"><a href="someurl.com/mail.php?id2424">New Friend Request</a></div>
<div id="comment_notification"><a href="someurl.com/mail.php?id2424">New Profile COmments</a></div>
<div id="photo_comment_notification"><a href="someurl.com/mail.php?id2424">New Photo Comments</a></div>
所以能有人告诉我我会怎么做呢?
这里是我出的AJAX通知,使用旧方法CUREENT代码,它不使用JSON但
<!-- Auto update/look for NEW notifications -->
<script type='text/javascript'>
$(document).ready(function(){
var updatenotification = function(){
$('#notificationcontainer')
.load('/modules/member/home/notifications.inc.php')
.fadeIn("slow");
};
var auto_refresh = setInterval(function(){updatenotification();}, 5000);
updatenotification();
});
</script>
<!-- ENDS HERE -->
答
更改您的更新通知消息,使用获得的,而不是负担,并有回调迭代通过JSON键,显示那些对应于键的值为1的DIV。
var updatenotification = function(){
$('#notificationcontainer')
.get('/modules/member/home/notifications.inc.php',null,function(data) {
for (key in data) {
if (data[key]) {
$('#' + key + '_notification').fadeIn();
}
}
});
};
哇,这看起来太简单了!既然它还没有完全编码,我应该问,有什么我应该改变的表现?这个脚本会反复运行很多次,感谢您的帮助 – JasonDavis 2009-08-30 02:22:38