एक एपीआई और जेएस फ़ाइल को गतिशील रूप से

लोड करने का प्रयास कर रहा हूं, मैं गतिशील रूप से स्काईस्कैन एपीआई लोड करने की कोशिश कर रहा हूं लेकिन यह काम नहीं कर रहा है। मैंने हर संभव तरीके से कोशिश की जिसकी मैं सोच सकता था और यह सब घटित होता है कि सामग्री गायब हो जाती है।एक एपीआई और जेएस फ़ाइल को गतिशील रूप से

मैंने console.log की कोशिश की जो कोई परिणाम नहीं देता; मैंने क्रोम के डेवलपर्स टूल से तत्वों की कोशिश की और सभी सामग्री का सीएसएस वही रहता है, फिर भी सामग्री गायब हो जाती है (मैंने सोचा कि यह डिस्प्ले जोड़ सकता है: एचटीएमएल/बॉडी सॉर्ट पर कोई भी नहीं)। मैंने सभी Google की एसिंच चाल की कोशिश की, फिर भी रिक्त पृष्ठ। मैंने अभी भी एक ही परिणाम के साथ एसिंक लोडिंग के लिए सभी जेएस प्लगइन्स की कोशिश की।

स्काईस्कैनर का एपीआई दस्तावेज खराब है और जब वे कॉलबैक देते हैं तो यह Google के एपीआई के कॉलबैक के तरीके से काम नहीं करता है।

उदाहरण: http://jsfiddle.net/s2HkR/

तो मैं कैसे बटन क्लिक करें या async पर एपीआई लोड कर सकते हैं: http://jsfiddle.net/7TWYC/

शीर्ष अनुभाग में लोड हो रहा है एपीआई के साथ उदाहरण? फ़ाइल के बिना हेड सेक्शन में। यदि पृष्ठ को खाली या किसी अन्य तरीके से बनाने के लिए दस्तावेज़ को लिखने का कोई तरीका है। मैं सादा जेएस, jQuery या PHP का उपयोग नहीं करेंगे।

संपादित करें:

मैं 50 मैं पहले था के ontop 250 करने के लिए एक इनाम निर्धारित किया है।

ऑरलैंडो लीट ने इस एसिंच एपीआई लोड को कैसे बनाया जाए, इस बारे में वास्तव में एक करीबी विचार का उत्तर दिया हालांकि कुछ सुविधाएं काम नहीं चुनती हैं जैसे कि तारीखों का चयन करना और मैं स्टाइल सेट करने में सक्षम नहीं हूं।

मैं एक ऐसा उत्तर ढूंढ रहा हूं जिसके लिए मैं सभी सुविधाओं का उपयोग करने में सक्षम हूं ताकि यह काम करे क्योंकि यह लोड पर लोड होने पर काम करेगा।

यहाँ ऑरलैंडो के द्वारा अद्यतन बेला है: http://jsfiddle.net/cxysA/12/

संपादित 2 गिज्स जवाब पर:

गिज्स दस्तावेज़.लिखें अधिलेखन पर दो लिंक का उल्लेख किया। यह एक अद्भुत विचार लगता है लेकिन मुझे लगता है कि मैं जो कोशिश कर रहा हूं उसे पूरा करना संभव नहीं है।

मैं जॉन Resig तरह से इस्तेमाल किया जिनमें से दस्तावेज़.लिखें को रोकने के लिए यहां पाया जा सकता: http://ejohn.org/blog/xhtml-documentwrite-and-adsense/

मैं इस विधि का इस्तेमाल किया है, मैं सफलतापूर्वक एपीआई लोड लेकिन snippets.js फ़ाइल सब पर लोड नहीं कर रहा है।

फिडल: http://jsfiddle.net/9HX7N/

स्रोत

2011-11-20 jQuerybeast

ऐसा लगता है कि स्क्रिप्ट एक और स्क्रिप्ट लोड करता है, एपीआई कुंजी के आधार पर की तरह (ध्यान दें यह अभी भी समय समाप्त पाश आंतरिक रूप से उपयोग करने के लिए लगता है)। यह अजीब बात है, जब मैं बटन पर क्लिक करता हूं, तो यह शरीर टैग ओ.ओ –

साफ़ करता है जो मेरा प्रश्न है – jQuerybeast

मुझे प्यार है कि आपका हैंडल jQuerybeast है और आपका प्रतिनिधि 666 है। आपका काम यहां किया गया है। – ThinkingStiff

इस तरह के समस्याग्रस्त मामलों के लिए, आप document.write को ओवरराइट कर सकते हैं। हैकी नरक के रूप में, लेकिन यह काम करता है और आप यह तय करने के लिए मिलता है कि सभी सामग्री कहां जाती है। उदाहरण देखें। this blogpost by John Resig। यह आईई को अनदेखा करता है, लेकिन कुछ काम के साथ चाल आईई में भी काम करती है, उदाहरण के लिए देखें। this blogpost।

तो, मैं अपने स्वयं के फ़ंक्शन के साथ document.write ओवरराइट करने का सुझाव दूंगा, जहां आवश्यक हो वहां आउटपुट को बैच करें, और जहां आप चाहें उसे रखें (उदाहरण के लिए। <body> 'के नीचे एक div में)। इससे स्क्रिप्ट को आपके पृष्ठ की सामग्री को कम करने से रोकना चाहिए।

संपादित करें: ठीक है, इसलिए मैंने इस स्क्रिप्ट को देखने के लिए कुछ समय लिया/लिया। भविष्य के संदर्भ के लिए, तृतीय-पक्ष स्क्रिप्ट की जांच के लिए http://jsbeautifier.org/ जैसे कुछ का उपयोग करें। उस तरह से पढ़ने के लिए बहुत आसान है। सौभाग्य से, कोई भी अपर्याप्तता/न्यूनीकरण नहीं है, और इसलिए आपके पास उनके एपीआई दस्तावेज के लिए एक पूरक है (जिस तरह से मैं खोजने में असमर्थ था, मुझे केवल 'कोड विज़ार्ड' मिला, जिसमें मुझे कोई रूचि नहीं थी) ।

यहाँ लगभग एक काम उदाहरण है: http://jsfiddle.net/a8q2s/1/

ये कदम उठाएँ मैं ले लिया है:

ओवरराइड document.write। से पहले आपको प्रारंभिक स्क्रिप्ट लोड करने की आवश्यकता है। आपके प्रतिस्थापन फ़ंक्शन को कोड की स्ट्रिंग को DOM में जोड़ना चाहिए। पुराने document.write पर कॉल न करें, जो आपको केवल त्रुटियां प्राप्त करेगा और वैसे भी नहीं करेगा जो आप चाहते हैं। इस मामले में आप भाग्यशाली हैं क्योंकि सभी सामग्री एक document.write कॉल में है (प्रारंभिक स्क्रिप्ट का स्रोत देखें)। यदि यह मामला नहीं था, तो आपको HTML को तब तक बैच करना होगा जब तक कि वे आपको दिए गए HTML को वैध न हों और/या आपको यकीन था कि कुछ और नहीं आ रहा था।
बटन पर प्रारंभिक स्क्रिप्ट लोड करें jQuery के $.getScript या समकक्ष के साथ क्लिक करें। कॉलबैक फ़ंक्शन पास करें (मैंने स्पष्टता के लिए नामित फ़ंक्शन संदर्भ का उपयोग किया है, लेकिन यदि आप चाहें तो आप इसे रेखांकित कर सकते हैं)।
मॉड्यूल लोड करने के लिए स्काईस्कैनर को बताएं।

संपादित करें # 2: हां, उनके पास एक स्क्रिप्ट लोड होने के बाद कॉलबैक प्राप्त करने के लिए एक एपीआई (skyscanner.loadAndWait) है। कि का उपयोग करते हुए काम करता है:

http://jsfiddle.net/a8q2s/3/

स्रोत

2011-12-14 09:25:21 Gijs

मैं इसे हल करने का प्रयास कर रहा हूं। गंभीरता से अगर मैं इसे समझने में सक्षम हूं तो मैं सबसे खुश व्यक्ति बनूंगा। – jQuerybeast

मेरा मानना है कि यह संभव नहीं है। आपको एपीआई लोड करना होगा, फिर स्निपेट लोड करना होगा और फिर कॉलबैक सेट करना होगा। यदि आप स्निपेट से पहले दस्तावेज़ लिखते हैं। स्निपेट लोड नहीं होता है। और इसके विपरीत, यदि आप पहले स्निपेट लोड करते हैं, तो पृष्ठ खाली हो जाता है। मेरी पहेली जांचें: http://jsfiddle.net/bLmer/ – jQuerybeast

असल में मैं एक ऐसे तरीके की तलाश कर रहा हूं जिससे यह नए दस्तावेज़ की अनुमति दे .write है लेकिन पृष्ठ को साफ़ करने से रोकता है। – jQuerybeast

skyrunner.js फ़ाइल वे दस्तावेज़.लिखें उपयोग कर रहे हैं पृष्ठ लोड वापस फोन पर खाली बनाने के लिए ... तो यहाँ अपने परिदृश्य में कुछ परिणाम हैं ..

यह जब आप बटन पर क्लिक करते हैं तो पृष्ठ खाली हो जाता है।
तो, यह पृष्ठ से 'jQuery.js' तक सबकुछ हटा देता है, यही कारण है कि कॉल बैक काम नहीं कर रहा है .. i.e मुख्य फ़ंक्शन को लागू नहीं किया जा सकता क्योंकि यह jQuery का उपयोग करके लिखा गया है।
और आपने id = map (कोड के अनुसार) के साथ एक लक्ष्य 'div' टैग को याद किया है।असल में यह वह लक्ष्य है जहां नक्शा लोड होता है।
एक और चीज जो मैंने देखी है वह है कि मानचित्र वास्तव में वर्तमान संदर्भ में एक div नहीं है, जो लोड करने के लिए मानचित्र एपीआई है।

यहां आपको पुराने स्कूल दृष्टिकोण के साथ जाना होगा, यही है .. आपको मुख्य सामग्री के शीर्ष पर अपनी skyrunner.js फ़ाइल शामिल करनी चाहिए।

तो उस फ़ाइल को डाउनलोड करने का प्रयास करें और हेड टैग में शामिल करें।

धन्यवाद

स्रोत

2011-11-20 05:05:25 Exception

@ ब्रैंडन-टिली आपके संपादन के लिए धन्यवाद :-) – Exception

मैंने देखा है। मेरा सवाल है कि skyscanner.js को सिर में उपयोग न करें क्योंकि कभी-कभी यह लगी हुई है, जिससे मेरा पूरा वेबपैम अंतराल हो जाता है। – jQuerybeast

क्या बटन पर क्लिक करने के लिए पृथ्वी (PHP, AJAX) पर कोई रास्ता है? कुछ भी जो कह सकता है, सभी दस्तावेज़ रद्द करें। पेज को खाली करें? – jQuerybeast

मैं belive क्या आप चाहते हैं यह है:

function loadSkyscanner() 
{ 
    function loaded() 
    { 
     t.skyscanner.load('snippets', '1', {'nocss' : true}); 

     var snippet = new t.skyscanner.snippets.SearchPanelControl(); 
     snippet.setCurrency('GBP'); 
     snippet.setDeparture('uk'); 
     snippet.draw(document.getElementById('snippet_searchpanel')); 
    } 

    var t = document.getElementById('sky_loader').contentWindow; 
    var head = t.document.getElementsByTagName('head')[0]; 
    var script = document.createElement('script'); 
    script.type = 'text/javascript'; 
    script.onreadystatechange= function() { 
     if(this.readyState == 'complete') loaded(); 
    } 
    script.onload= loaded; 
    script.src= 'http://api.skyscanner.net/api.ashx?key=PUT_HERE_YOUR_SKYSCANNER_API_KEY'; 
    head.appendChild(script); 
} 

$("button").click(function(e) 
{ 
    loadSkyscanner(); 
});

यह आइफ्रेम # sky_loader में लोड Skyscanner है कॉल लोड SearchPanelControl बनाने के लिए समारोह के बाद। लेकिन अंत में, स्निपेट मुख्य दस्तावेज़ में खींचता है। यह वास्तव में एक विचित्र कामकाज है, लेकिन यह काम करता है।

केवल प्रतिबंध है, आपको एक आईफ्रेम की आवश्यकता है। लेकिन आप इसे display:none का उपयोग करके छिपा सकते हैं।

A working example

संपादित

क्षमा पुरुष, मैं इसे नहीं देखा। अब हम देख सकते हैं कि गगनचुंबी इमारत एपीआई कितनी भयानक है। यह स्वत: पूर्ण बनाने के लिए दो divs डालता है, लेकिन उस तत्व के सापेक्ष नहीं जिसे आप आकर्षित करने के लिए कहते हैं, लेकिन दस्तावेज़। जब किसी आईफ़्रेम में कोई स्क्रिप्ट लोड की जाती है, तो दस्तावेज़ iframe दस्तावेज़ है।

function loadSkyscanner() 
{ 
    var t; 
    this.skyscanner; 
    var iframe = $("<iframe id=\"sky_loader\" src=\"http://fiddle.jshell.net/orlleite/2TqDu/6/show/\"></iframe>"); 

    function realWorkaround() 
    { 
     var tbody = t.document.getElementsByTagName("body")[0]; 
     var body = document.getElementsByTagName("body")[0]; 

     while(tbody.children.length != 0) 
     { 
      var temp = tbody.children[0]; 
      tbody.removeChild(temp); 
      body.appendChild(temp); 
     } 
    } 

    function snippetLoaded() 
    { 
     skyscanner = t.skyscanner; 

     var snippet = new skyscanner.snippets.SearchPanelControl(); 
     snippet.setCurrency('GBP'); 
     snippet.setDeparture('uk'); 
     snippet.draw(document.getElementById('snippet_searchpanel')); 

     setTimeout(realWorkaround, 2000); 
    } 

    var loaded = function() 
    { 
     console.log("loaded"); 
     t = document.getElementById('sky_loader').contentWindow; 

     t.onLoadSnippets(snippetLoaded); 
    } 

    $("body").append(iframe); 
    iframe.load(loaded); 
} 

$("button").click(function(e) 
{ 
    loadSkyscanner(); 
});

लोड एक और एचटीएमएल जो भार और कॉलबैक जब टुकड़ा भरी हुई है के साथ एक iframe:

वहाँ एक समाधान है, लेकिन मैं सलाह नहीं देते, वास्तव में एक समाधान नहीं है। लोड किए जाने के बाद स्निपेट बनाएं जहां आप चाहते हैं और टाइमआउट सेट करने के बाद, क्योंकि हम नहीं जानते कि SearchPanelControl लोड होने पर हम नहीं जानते हैं। यह realWorkaround स्वत: पूर्ण div को मुख्य दस्तावेज़ में ले जाएं।

You can see a work example here

The iframe loaded is this

संपादित

बग आप पाया फिक्स्ड और लिंक को अपडेट।

for लूप चला गया है और थोड़ी देर जोड़ा गया है, अब बेहतर काम करता है।

while(tbody.children.length != 0) 
    { 
     var temp = tbody.children[0]; 
     tbody.removeChild(temp); 
     body.appendChild(temp); 
    }

स्रोत

2011-11-22 20:41:45

ऐसा लगता है कि मैं क्या देख रहा था हालांकि कृपया ध्यान दें कि स्वत: पूर्ण काम नहीं करता है? कृपया यहां जांचें: http://jsfiddle.net/s2HkR/ यह एपीआई लोड करने का डिफ़ॉल्ट तरीका है। जब आप कोई शहर टाइप करते हैं तो खोज फ़ॉर्म का स्वत: पूर्ण नोट करें। आपके कामकाजी उदाहरण पर, इसे काम करने से रोक दिया जा रहा है। हालांकि ऐसा करने का आपका विचार प्रतिभा है और मुझे कोई आइफ्रेम छुपा नहीं है। धन्यवाद – jQuerybeast

बहुत बढ़िया। वैसे आप अनुशंसा नहीं करते हैं लेकिन मुझे लगता है कि मुझे कोई और समाधान नहीं मिला है? यह एक डैशबोर्ड वेबपैप के लिए है और जब उनका सर्वर लगी है, तो सभी डैशबोर्ड इसके साथ लगी हुई हैं। – jQuerybeast

ठीक है यह एक घंटे की तरह है मैं इसे समझने की कोशिश कर रहा हूं। मैंने सोचा कि यह मेरे पेज पर एक समस्या थी लेकिन मुझे लगा कि यह आपके उदाहरण पर भी काम नहीं करता है। इसे देखें: http://jsfiddle.net/orlleite/cxysA/7/show/ यदि आप अपनी पहेली को अपने आप देखते हैं, तो यह कुछ भी प्रदर्शित नहीं करता है। (हालांकि यह काम करता है: http://fiddle.jshell.net/orlleite/cxysA/7/show/) धन्यवाद एक बार फिर – jQuerybeast

एक एपीआई और जेएस फ़ाइल को गतिशील रूप से

उत्तर

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