Как перезагружать JSON с AJAX каждые 10 секунд - PullRequest
Новая
       3

Как перезагружать JSON с AJAX каждые 10 секунд

8 голосов
/ 27 сентября 2010

Я пытаюсь перезагружать файл JSON каждые 10 секунд с помощью JQUERY.

Страница находится здесь: http://moemonty.com/chirp/chirp.html

Код здесь: 

<html>
<head>
<title>the title</title>
 <!-- included Jquery Library -->
    <script type="text/javascript" src="./js/jquery-1.4.2.js"></script>
 <!-- jquery library -->
  </head>
<body>  
 <script>

$.ajaxSetup({ cache: false }); //disallows cachinge, so information should be new


function loadChirp(){ //start function

var url = "http://www.chirpradio.org/json";
        $.getJSON("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20json%20where%20url%3D%22"+url+"%22&format=json&callback=?", 
            function(data){
            console.log(data.query.results.json);

                document.write('The artist is: ' + data.query.results.json.artist + '<br/><br/>');

                document.write('The artist is: ' + data.query.results.json["record-label"] + '<br/><br/>' );

                document.write('The album is: ' + data.query.results.json.album + '<br/><br/>');

                document.write('The record label is: ' + data.query.results.json["record-label"] + '<br/><br/>');

                document.write('The feedback link is: ' + data.query.results.json["feedback-link"] + '<br/><br/>');

                document.write('The database id is: ' + data.query.results.json["database-id"] + '<br/><br/>');

                document.write('The time is: ' + data.query.results.json.timestamp.time + ' ');

                document.write(data.query.results.json.timestamp["am-pm"] + '<br/><br/>');

                document.write('The current dj is: ' + data.query.results.json["current-dj"] + '<br/><br/>');


                setTimeout("loadChirp()",5000);
                alert('The timeout was triggered.');

            }); 

} //end function        


$(document).ready(function(){ 
//DOCUMENT READY FUNCTION
    loadChirp();
}); 
//DOCUMENT READY FUNCTION 


</script>  
</body>
</html>

Кажется, он не работает.

Ответы [ 4 ]

12 голосов
/ 27 сентября 2010

Возможно, вы хотите, чтобы предыдущий набор возвращаемых данных был заменен новым, а не добавлялся.В этом случае, используя jQuery, вы можете: 

<div id='content'></div>
<script>
     function loadChirp(){
         $.getJSON("http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20json%20where%20url%3D%22"+url+"%22&format=json&callback=?", 
              function(data) {
                  $('#content').html('The artist is: ' + data.query.results.json.artist + '<br/><br/>');
              }); 
         setTimeout("loadChirp()",5000);
      }
</script>

и т.д ...

3 голосов
/ 27 сентября 2010

Я бы ожидал, что цикл будет работать так, как указано в кавычках, но может быть тонкость в том факте, что вы используете JSONP. Я бы изменил setTimeout вызов на: 

setTimeout(loadChirp, 5000);

... по нескольким причинам. Во-первых, лучше использовать ссылку на функцию, а не строку кода, а во-вторых, вы совершенно уверены, что получаете правильную ссылку на функцию (тогда как со строкой, какая ссылка вы получите, зависит от контекста в котором выполняется код).

Но, как указал Пойнти в комментарии, есть отдельная проблема: document.write не будет делать то, что вы, вероятно, хотите, чтобы он делал там. Вы можете использовать document.write только для записи в поток HTML, который анализируется как часть исходной загрузки страницы. После загрузки страницы вы больше не сможете ее использовать. Попробуйте использовать jQuery append или appendTo и аналогичные функции для добавления в DOM после загрузки страницы.

0 голосов
/ 27 сентября 2010

Вы обязательно должны использовать:

setInterval ("loadChirp", 10000):

Не пишите loadCrirp () внутри setInterval, поскольку мы только передаемссылка

0 голосов
/ 27 сентября 2010

У вас ошибка в console.log(data.query.results.json); - консоль не определена.Также вы можете использовать setInterval( "function()", 5000 );.

Добро пожаловать на сайт PullRequest, где вы можете задавать вопросы и получать ответы от других членов сообщества.

Нет похожих вопросов

...