Обновление фрейма jQuery для обновлений в реальном времени - PullRequest
0 голосов
/ 24 января 2012

Я хочу поработать над некоторыми обновлениями в реальном времени, которые отображаются в iframe. Этот файл с именем disp.php запрашивает таблицу «записей» в базе данных и отображает их все снизу вверх. Теперь, когда новая запись добавляется в «сообщения», я хочу, чтобы она отображалась в режиме реального времени.

Я мог бы добиться этого, используя

<meta http-equiv="refresh" content="10" />  

в disp.php. Но все же постоянное чувство освежения раздражает. Теперь я пытаюсь добиться обновления таким способом, который не работает.

<!DOCTYPE html> 
<html>
<head>
<title>Live Updates</title>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js">
</script>
<script> 
function refreshLiveFrame() {
$('body', window.frames['myliveframe'].document).loadIfModified("disp.php");
setTimeout("refreshLiveFrame()", 1000);
}
$(document).ready(function() {
refreshConsole();
});
</script> 
</head>
<body>
<iframe name="myliveframe" src="disp.php">
</iframe>
</body>
</html>

Мне нужен способ для живого асинхронного обновления. У кого-нибудь есть обходной путь? Спасибо.

Ответы [ 2 ]

2 голосов
/ 25 января 2012
<!DOCTYPE html> 
<html>
    <head>
    <title>Live Updates</title>
        <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.5/jquery.min.js"></script>
        <script type="text/javascript">
            $(document).ready(function()
            {
                refresh(); // Calling refresh() on document ready
                window.setInterval("refresh()", 10000); // Calling refresh() every 10 seconds
            });

            function refresh()
            {
                // Asynchonously requesting the content of disp.php
                $.get('disp.php', function(data)
                {
                    // This will be executed when you get the response back from the server
                    $('#posts').html(data);
                });
            }
        </script> 
    </head>
    <body>
        <div id="posts"></div>
    </body>
</html>
1 голос
/ 24 января 2012

Вы пытаетесь достичь своей цели с помощью опроса, это плохая практика, и, когда это возможно, лучше избегать этого и использовать вместо этого толкание.Опрос означает продолжать запрашивать ресурс постоянно, пока он не станет доступным.Pushing означает, что сам ресурс сообщит вам, как только он станет доступным.

В этом случае вы можете использовать pushing, используя jQuery, например:

$('iframe[name=myliveframe]').load(function()
{
    // This will be called every time the page inside the iframe has finished loading
    // $(this).contents() contains the page HTML
    // Use $(this).contents().find('body').html() if you want to read the content of the <body>
});
...