2010-09-27 9 views
7

मैं JQUERY के साथ हर 10 सेकंड में एक JSON फ़ाइल पुनः लोड करने का प्रयास कर रहा हूं।AJAX के साथ JSON को फिर से लोड करने के लिए प्रत्येक 10 सेकेंड

पृष्ठ यहां है: 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> 

यह काम करने लगता है।

+2

* काम नहीं कर रहे हैं * नहीं है एक बहुत सटीक समस्या विवरण टी। अपेक्षित परिणाम क्या है, वास्तविक परिणाम क्या है (त्रुटि संदेश, HTTP स्थिति कोड)? –

+0

ठीक है * क्या होता है? – Pointy

+1

इसके अलावा, अगर टाइमआउट कोड काम करता है, तो मुझे नहीं लगता कि उन सभी 'document.write' कॉल वही करेंगे जो आप चाहते हैं। – Pointy

उत्तर

11

शायद आप इसे जोड़ने के बजाय नए सेट द्वारा प्रतिस्थापित डेटा के पिछले सेट को प्रतिस्थापित करना चाहते हैं। उस मामले में, 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> 

आदि ...

+2

अच्छा जवाब, लेकिन 'setTimeout ("loadChirp()", 5000);' सेटटाइमआउट (लोड सीरप, 5000) होना चाहिए; 'स्ट्रिंग को' सेटटाइमआउट 'या' सेट इंटरवल 'में स्ट्रिंग पास करने के लिए लगभग कभी भी उचित नहीं है। –

+1

प्रश्न हर 10 सेकंड को फिर से लोड करना था, इसलिए यह होना चाहिए: setInterval (loadChirp, 10000); – George

+0

सेटटाइमआउट होना चाहिए (loadChirp, 10000); बिना लोड() या लोड क्रिस्प फ़ंक्शन पर। निष्पादन "()" के साथ फ़ंक्शन को कॉल करना एक भयानक रिकर्सन को मुक्त करना चाहिए। –

3

मैं लूप को उद्धृत के रूप में काम करने की अपेक्षा करता हूं, लेकिन इस तथ्य के आस-पास एक subtlety हो सकता है कि आप JSONP का उपयोग कर रहे हैं। कारणों की एक जोड़ी के

setTimeout(loadChirp, 5000); 

...: मैं करने के लिए setTimeout कॉल बदल जाएगा। सबसे पहले, कोड स्ट्रिंग के बजाए फ़ंक्शन संदर्भ का उपयोग करना आम तौर पर एक बेहतर विचार है, और दूसरा बंद, आप निश्चित हैं कि आपको सही फ़ंक्शन संदर्भ मिल रहा है (जबकि स्ट्रिंग के साथ, आपको कौन सा संदर्भ मिलता है संदर्भ पर निर्भर करता है जिसमें कोड निष्पादित किया जाता है)।

लेकिन जैसा कि पॉइंटी ने एक टिप्पणी में बताया, एक अलग मुद्दा है: document.write ऐसा नहीं करेगा जो आप शायद वहां करना चाहते हैं। आप केवल HTML स्ट्रीम को लिखने के लिए document.write का उपयोग कर सकते हैं जिसे मूल पृष्ठ लोड के हिस्से के रूप में पार्स किया जा रहा है। पेज लोड के बाद, आप अब इसका उपयोग नहीं कर सकते हैं। JQuery के append या appendTo और पृष्ठ लोड के बाद DOM में जोड़ने के लिए समान फ़ंक्शंस का उपयोग करने पर विचार करें।

+0

डाउनवॉटर: मुझे क्या याद आ रही है? –

0

आपको console.log(data.query.results.json); में कोई त्रुटि है - कंसोल परिभाषित नहीं है। इसके अलावा, आप setInterval("function()", 5000); का उपयोग कर सकते हैं।

+1

'कंसोल' को कई ब्राउज़रों (फ़ायरफ़ॉक्स, क्रोम, ...) पर परिभाषित किया जाएगा, और आईई पर नहीं। मैं अनुमान लगा रहा हूं कि वह इसका उपयोग कर रहा है, वह एक ब्राउज़र का उपयोग कर रहा है जहां यह समर्थित है। –

+1

बस अधिक विशिष्ट होने के लिए, यदि आप setInterval का उपयोग करते हैं, तो इसे दस्तावेज़ पर तैयार करें, न कि फ़ंक्शन के अंदर। – o15a3d4l11s2

0

आप निश्चित रूप से उपयोग करना चाहिए:

setInterval ("loadChirp", 10000):

loadInrval के अंदर loadCrirp() लिखना न करें क्योंकि हम केवल एक रिफ्रेंस

+0

* "loadInrval के अंदर loadCrirp() को मत लिखो क्योंकि हम केवल एक रिफ्रेंस पास कर रहे हैं" * फिर आपका उदाहरण अभी भी एक स्ट्रिंग क्यों पास करता है? फ़ंक्शन के संदर्भ को पास करने के लिए आपको उद्धरणों को हटाने की आवश्यकता है; अन्यथा, 'setInterval' स्ट्रिंग का मूल्यांकन करेगा, जिसका कोई प्रभाव नहीं होगा (उदाहरण के लिए, यह फ़ंक्शन को कॉल नहीं करेगा)। –

संबंधित मुद्दे

 संबंधित मुद्दे