0

私はAJAX/jquery通知スクリプトに取り組んでいます。
現在、AJAX応答で10秒ごとにfhtml形式のページ全体を再調整します。
返されるページは、表示する必要のあるアイテムのみを表示するPHPページです（新しいメールメッセージや新しいコメントなど、何か新しいものが表示されるアイテムのみ）。

代わりにJSONを使用するようにこれを変更したいのですが、メインページ（親）には通知アイテムごとにDIVがあり、デフォルトではCSSを使用して非表示になり、JSON応答で非表示を解除するア​​イテムが示されます。

これが私の基本的な計画であり、以下はビジュアル用のモックアップコードです。

JSON応答では、10個の可能なアイテムのうち、1でマークされたアイテムのみが返されます（そのアイテムを表示する場合はyesを意味します）
。すでに表示されていることが確認されているアイテムのみを表示しているため、1は必要ない場合があります。 PHP？ 

{"mail":"1", "friend_request":"1" , "comment":"1" , "photo_comment":"1"},

メインの親ページには、CSSを使用したDIVがあり、このように非表示になっています。（デモ用のアイテムは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 -->
4

1 に答える 1

4

load の代わりに get を使用するように更新通知メッセージを変更し、コールバックが 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();
        }
      }
    });
};
于 2009-08-30T02:18:48.130 に答える