2011-12-08 15 views
5

में किसी सामग्री को सत्यापित करने के लिए कैसे मेरे पास JSON फ़ीड n में URL हैं प्रत्येक URL में एक छवि होती है। मैं उन यूआरएल को मान्य करना चाहता हूं जिनमें छवि है या नहीं (एनयूएलएल)। जावास्क्रिप्ट का उपयोग करके इसे कैसे सत्यापित करें। क्योंकि मैं एक नौसिखिया हूं, मुझे नहीं पता, इसे कैसे सत्यापित किया जाए। धन्यवादयूआरएल (जावास्क्रिप्ट)

 JSON feed with image n NULL 
     { 

     previewImage:"http://123.201.137.238:6060/feed/videoplay/Jackie.png", 

     }, 
     { 

     previewImage:"http://www.snovabits.net/feed/ImageMI/WarCraft.jpg", 

     }, 
+1

आप अधिमानतः दूसरे पहुँच लिंक के साथ नमूना json पोस्ट कर सकते हैं,:

अंत में यहाँ बेला की पूरी कोड है। साथ ही, उस कोड को पोस्ट करें जिसे आपने अभी तक लिखा/आजमाया है। –

+0

आप इसे जावास्क्रिप्ट के साथ अकेले नहीं कर सकते हैं जब तक कि सभी छवियां आपकी जावास्क्रिप्ट के समान डोमेन पर होस्ट न हों। क्या यह मामला है? –

+0

क्या कोई अन्य तरीका है? ऐसा करने के लिए – FreshBits

उत्तर

1

दिलचस्प सवाल!

छवियों को एक div में जोड़ने का प्रयास करें (jQuery का उपयोग करें, div को डिस्प्ले का उपयोग करके छुपाया जा सकता है: कोई नहीं;)।
तो नियमित रूप से छवियों के गुणों का परीक्षण (एक setInterval पाश का उपयोग करें) चाहे वे एक सफल लोड संकेत मिलता है। कुछ टाइमआउट परिभाषित करें जिसके बाद setInterval खुद को मार डालेगा।

यह गुण Chrome और Firefox में सफल img लोड के परीक्षण के लिए काम करता है:

fileCreatedDate != '' 

टेस्ट दोनों बनाने के लिए:

naturalHeight != 0 

यह गुण IE7,8,9 करने में सफल img लोड के परीक्षण के लिए काम करता है यह सभी प्रमुख ब्राउज़रों में काम करता है।

यहाँ देखने के लिए कैसे रंगमंच की सामग्री लोड की प्रक्रिया के दौरान 10ms चरणों में बदल एक बेला है। विभिन्न ब्राउज़रों में यह प्रयास करें !:
http://jsfiddle.net/xGmdP/

क्रोम में और एफएफ तुम भी पूरा सभी छवियों की संपत्ति की जाँच करके setInterval पाश के लिए समय समाप्ति बदल सकते हैं। लेकिन दुर्भाग्यवश यह आईई में काम नहीं करता है (पूर्ण हमेशा उन छवियों के लिए IE में झूठा रहता है जिन्हें लोड नहीं किया जा सकता है)।

<html> 
<head> 
    <script src="http://code.jquery.com/jquery-latest.min.js" type="text/JavaScript"></script> 
    <script type="text/JavaScript"> 
    $(function(){ 
     $('#images').prepend('<img id="img1" src="http://123.201.137.238:6060/feed/videoplay/Jackie.png">') 
     $('#images').prepend('<img id="img2" src="http://www.snovabits.net/feed/ImageMI/WarCraft.jpg">') 
     setInterval(test, 10); 
    }) 

    function test(){ 
     var props=['naturalHeight', 'complete', 'fileCreatedDate', 'clientHeight', 'offsetHeight', 'nameProp', 'sourceIndex']; 
     for(i in props){ 
     var pr = props[i]; 
     $('#testresults').append('1:'+pr+' = ' + $('#img1').prop(pr)+'<br>'); 
     $('#testresults').append('2:'+pr+' = ' + $('#img2').prop(pr)+'<br>'); 
     } 
     $('#testresults').append('---<br>'); 
    } 
    </script> 
</head> 
<body> 
    <div id="images"><div> 
    <div id="testresults"></div> 
</body> 
</html> 
+0

डब्ल्यूओडब्ल्यू! महान! मैं वास्तव में इस जवाब की अपेक्षा करता हूं। अपनी प्रतिक्रिया देने के लिए आपका बहुत - बहुत धन्यवाद। – FreshBits

0

आप जाँच करना चाहते हैं, तो स्ट्रिंग शून्य है बस करो if(previewImage == "") { /* image is null, do stuff */ } लेकिन आप अगर छवि वास्तव में मौजूद है मैं AJAX के माध्यम से GET अनुरोध कर रही सुझाव है और HTTP प्रतिक्रिया, जैसे की जाँच करेगा जाँच करना चाहते हैं: (jQuery):

$.ajax({ 
    url: "http://123.201.137.238:6060/feed/videoplay/Jackie.png", 
    cache: false, 
    error: function(){ 
     alert("image doesn't exist!"); 
    } 
}); 

लेकिन यदि संभव हो तो यह सर्वर पक्ष करने के लिए "अच्छा" होगा।

+1

महान विचार, लेकिन मेरे लिए काम नहीं करता है। अलर्ट ट्रिगर किया गया है हालांकि छवि मौजूद है। – Jpsy

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