2009-08-30 3 views
0

저는 AJAX/jquery 알림 스크립트를 작성 중입니다.
현재 AJAX 응답에서 10 초마다 전체 fhtml 형식의 페이지가 retun됩니다. 이 반환
페이지는 내가 걸려에만 표시되어야 항목을 표시하는 PHP 페이지 (새 메일 메시지 또는 새 주석 등과 같은 새로운 쇼를 위로,이 항목 만 ..)AJAX JSON 응답에 적절한 데이터가 표시되면 어떻게 숨겨진 DIV를 표시 할 수 있습니까?

입니다 JSON 대신 내 메인 페이지 (부모)에서 각 알림 항목에 대한 DIV를 갖게되며 기본값으로 CSS 을 사용하여 숨겨지며 JSON 응답은 숨기기를 취소해야하는 항목을 알려줍니다.

그래서 내 기본 계획이며 아래는 시각적 인 모형을위한 모형입니다.

JSON 응답, 추천 가능한 항목에서, 그것은 단지 (해당 항목을 표시하는 의미 예) 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> 

그래서 누군가가 저를 보일 수 있는가? 여기


는 아약스 통지를 보여주는 OLD 방법을 사용하여 내 CUREENT 코드는 아직

<!-- 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 --> 

답변

3

가 변경하여 업데이트 알림 메시지가 대신 부하의 수 사용하는 JSON을 사용하지 않고있다 콜백은 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(); 
         } 
        } 
       }); 
    }; 
+0

와우는 너무 간단합니다! 아직 완전히 코딩되지 않았으므로 성능을 위해 변경해야 할 부분이 있습니까? 이 스크립트는 여러 번 반복해서 실행됩니다. 도움을 주셔서 감사합니다. – JasonDavis