2009-05-04 5 views
53

मैं इसे पुनः लोड करने के लिए IFRAME के ​​src को बदल रहा हूं, यह ठीक काम कर रहा है और onload ईवेंट को अपने HTML लोड होने पर फायरिंग कर रहा है।इतिहास में जोड़ने के बिना IFRAME को दोबारा लोड करें

लेकिन यह इतिहास में एक प्रविष्टि जोड़ता है, जिसे मैं नहीं चाहता हूं। क्या IFRAME को पुनः लोड करने का कोई तरीका है और फिर भी इतिहास को प्रभावित नहीं करता है?

+5

मैं इस समस्या अनुमान लगा रहा हूँ वापस बटन है असल में पिछले पृष्ठ पर जाने से पहले आईफ्रेम के माध्यम से वास्तव में चक्र होगा। –

+1

जो कुछ भी करता है, मैं इतिहास में कोई जोड़ नहीं चाहता हूं, या क्या कोई तरीका है कि मैं नवीनतम इतिहास प्रविष्टि को हटा सकता हूं ?? –

उत्तर

27

आप जावास्क्रिप्ट location.replace उपयोग कर सकते हैं:

window.location.replace('...html'); 

एक प्रदान किए गए URL पर के साथ मौजूदा दस्तावेज़ को बदलें। विधि असाइन() से अंतर कि की जगह उपयोग करने के बाद() वर्तमान पेज सत्र इतिहास में सहेजा नहीं जाएगा, जिसका अर्थ है उपयोगकर्ता उस पर नेविगेट पर वापस बटन का उपयोग करने में सक्षम हो नहीं होगा।

+2

क्या यह पृष्ठ स्वयं ही लक्षित नहीं करेगा? मैं केवल IFRAME को फिर से लोड करना चाहता हूं और लोड किए गए दस्तावेज़ के अंदर चल रही स्क्रिप्ट पर मेरा कोई नियंत्रण नहीं है। –

+5

बस अपने आईफ्रेम के संदर्भ में "विंडो" को प्रतिस्थापित करें। – Ishmael

+0

यह इतना आसान नहीं है! –

17

ग्रेग की तरह ऊपर कहा गया है, .replace() फ़ंक्शन यह कैसे करना है। मुझे लगता है कि उसके जवाब का जवाब कैसे दिया जाए, लेकिन यह चाल आईफ्रेम सामग्री विन्डो प्रॉपर्टी का संदर्भ देना है।

var ifr = document.getElementById("iframeId"); 
ifr.contentWindow.location.replace("newLocation.html"); 

* अभी सीखा है कि मुझे किसी उत्तर पर टिप्पणी करने के लिए और अधिक प्रतिष्ठा की आवश्यकता है।

60

प्रतिस्थापन का उपयोग करना() केवल आपके डोमेन iframes के साथ एक विकल्प है। यह दूरस्थ साइटों पर काम करने में विफल रहता है (उदाहरण के लिए: एक ट्विटर बटन) और कुछ ब्राउज़र-विशिष्ट ज्ञान की आवश्यकता है ताकि बच्चे की विंडो को विश्वसनीय रूप से एक्सेस किया जा सके।

इसके बजाए, iframe तत्व को हटाएं और उसी स्थान पर एक नया निर्माण करें। इतिहास आइटम केवल तब बनाए जाते हैं जब आप DOM में src विशेषता को संशोधित करते हैं, इसलिए इसे संलग्न करने से पहले सेट करना सुनिश्चित करें।

संपादित करें: जेडैंडशिप सही मायने में उल्लेख करते हैं कि आप डोम, मोडिफ़ी और फिर से जोड़ सकते हैं। ताजा निर्माण की आवश्यकता नहीं है।

function setIFrameSrc(idFrame, url) { 
    var originalFrame = document.getElementById(idFrame); 
    var newFrame = document.createElement("iframe"); 
    newFrame.id = originalFrame.getAttribute("id"); 
    newFrame.width = originalFrame.getAttribute("width"); 
    newFrame.height = originalFrame.getAttribute("height"); 
    newFrame.src = url;  
    var parent = originalFrame.parentNode; 
    parent.replaceChild(newFrame, originalFrame); 
} 

इस तरह इसका इस्तेमाल:

setIFrameSrc("idframe", "test.html"); 

इस तरह नहीं यूआरएल iframe की जोड़ देगा

+4

हालांकि यह उत्तर स्वीकार्य उत्तर से 2 साल पहले है, ब्राउज़र के इतिहास में जोड़े बिना iframe URL/src को बदलने का यह सही तरीका है। Window.frames [frameName] का कोई अन्य संयोजन। स्थान और/या history.replaceState सुरक्षा कारणों से किसी आईफ्रेम में काम नहीं करेगा। यहां तक ​​कि एक ही डोमेन पर (जैसा कि मैंने अभी पाया)। –

+0

यह मैंने सबसे अच्छा काम करने का जवाब दिया है। मेरी समस्या हल – pppglowacki

+0

समाधान यह था! मुझे आईफ्रेम बनाने की ज़रूरत है ताकि इतिहास बरकरार रहे। – roq

5

कोशिश नई iframe के साथ पुराने आइफ्रेम जो पुराने एक से नकल प्रतिस्थापित करने के लिए इस सुविधा का उपयोग करने के लिए ब्राउज़र इतिहास के लिए।

+1

यह आसान है। धन्यवाद! –

+1

लवली, क्रोम और सफारी पर बहुत अच्छा काम करता है। – Amoss

11

आईफ़्रेम को पुनर्जीवित करने का एक वैकल्पिक तरीका डीओएम से आईफ़्रेम को हटाना होगा, src को बदलें और फिर इसे फिर से जोड़ें।

कई तरीकों से यह replace() सुझाव के समान है, लेकिन जब मैंने इतिहास.जेएस और प्रबंधन राज्यों के साथ उस दृष्टिकोण की कोशिश की तो मुझे कुछ समस्याएं थीं।

var container = iframe.parent(); 

iframe.remove(); 
iframe.attr('src', 'about:blank'); 

container.append(iframe); 
+0

मुझे वास्तव में यह पसंद है: यह एक नया आईफ्रेम बनाने से आसान तरीका बन गया है क्योंकि आपको सभी गुणों को नए आईफ्रेम (आईडी, आकार, स्टाइल क्लासेस, ...) – Legolas

+0

पर कॉपी करने की आवश्यकता नहीं है। मेरे। जिंदगी। एक लाख धन्यवाद ... – gcoladarci

7

एक समाधान iframe टैग के बजाय object टैग का उपयोग करने के लिए है।

इस जगह:

<iframe src="http://yourpage"/> 

इस द्वारा:

<object type="text/html" data="http://yourpage"/> 

आप इतिहास को प्रभावित किए बिना data विशेषता को अपडेट करने की अनुमति देगा। यह उपयोगी है यदि आप React.js जैसे घोषणात्मक ढांचे का उपयोग करते हैं जहां आपको DOM को अपडेट करने के लिए कोई अनिवार्य कमांड नहीं करना है। iframe और object के बीच मतभेदों पर

अधिक विवरण: Use of Iframe or Object tag to embed web pages in another

+0

!!! सबसे बढ़िया उत्तर !!! – xiefei

+0

महान उत्तर @JBE से सहमत हुए, इससे मुझे कोणीय 2 के साथ अत्यधिक मदद मिली और आईफ्रेम स्रोत नहीं होने से इतिहास अपडेट ट्रिगर हो गया। –

+0

यह मेरे लिए काम नहीं करता है। मैं क्रोम में हूँ यहां तक ​​कि iframe को नष्ट करना और किसी ऑब्जेक्ट के साथ इसे बदलना अभी भी डर्न ब्राउज़र इतिहास स्थिति का कारण बनता है (जो कोई समझ में नहीं आता है क्योंकि नष्ट ऑब्जेक्ट को कभी भी इसकी सामग्री वापस नहीं मिल जाएगी)। Grrrrrrrrr। – trusktr

0

सबसे सरल और तेजी से लोड हो रहा है समाधान जब पेज या फ्रेम लोड हो रहा है
उपयोग window.location.replace इतिहास को अद्यतन नहीं करने के लिए।

<a href="#" onclick="YourTarget.location.replace ('http://www.YourPage.com');"> 
The targeted Link</a> 

या

<a href="javascript:YourTarget.location.replace ('http://www.YourPage.com');"> 
The targeted Link</a> 



लेकिन आप इसे लिंक से कार्य करने के लिए नहीं, लेकिन जब फ्रेम लोड हो रहा है स्वचालित रूप से कार्य करना चाहते हैं:

लिंक के लिए यह इस तरह दिखता है फिर iframe से आपको इसे iframe फ़ाइल बॉडी सेक्शन में रखना चाहिए:

onload="window.location.replace ('http://www.YourPage.com');" 


किसी कारण से ऑनलोड iframe में लोड नहीं होता है तो इस तरह वाक्य रचना में खिड़की के अपने लक्ष्य फ्रेम नाम डाल बजाय:

onload="YourTarget.location.replace ('http://www.YourPage.com');" 



नोट : इस स्क्रिप्ट के लिए सभी onclick, onmouseover, onmouseout, onload और href="javascript:" काम करेगा।

0

इतिहास करने के लिए iframe के URL के अलावा बायपास करने के लिए replace विधि का उपयोग करें:

HTML:

<iframe id="myIframe" width="100%" height="400" src="#"></iframe> 

जावास्क्रिप्ट:

var ifr = document.getElementById('mIframe') 
if (ifr) { 
    ifr.contentWindow.location.replace('http://www.blabla.com') 
}