ما هي أفضل طريقة تحديث / تحديث iframe?

Question

أود أن تحديث أحد <iframe> باستخدام جافا سكريبت.أفضل طريقة وجدتها حتى الآن تم تعيين iframe هو src تنسب إلى نفسها ، ولكن هذه ليست نظيفة جدا.أي أفكار ؟

Answer 1

document.getElementById('some_frame_id').contentWindow.location.reload();

كن حذرا في فايرفوكس ، window.frames[] لا يمكن فهرستها من قبل معرف لكن حسب الاسم أو مؤشر

Answer 2

document.getElementById('iframeid').src = document.getElementById('iframeid').src

فإنه سيتم تحميل iframe, حتى عبر المجالات!اختبار مع IE7/8, فايرفوكس و كروم.

Answer 3

إذا باستخدام مسج, يبدو أن هذا العمل:

$('#your_iframe').attr('src', $('#your_iframe').attr('src'));

آمل انها ليست قبيحة جدا بالنسبة ستاكوفيرفلوو.

Answer 4

window.frames['frameNameOrIndex'].location.reload();

Answer 5

إضافة مساحة فارغة أيضا تحميل iFrame تلقائيا.

document.getElementById('id').src += '';

Answer 6

بسبب سياسة المنشأ نفسه, هذا لن تعمل عند تعديل iframe لافتا إلى مجال مختلف.إذا كنت يمكن أن الهدف أحدث المتصفحات, النظر في استخدام HTML5 عبر وثيقة الرسائل.عرض المتصفحات التي تدعم هذه الميزة هنا: http://caniuse.com/#feat=x-doc-messaging.

إذا لم تتمكن من استخدام HTML5 وظائف, ثم يمكنك اتباع الحيل المذكورة هنا: http://softwareas.com/cross-domain-communication-with-iframes.هذا بلوق الدخول أيضا يقوم بعمل جيد من تحديد المشكلة.

Answer 7

لقد جئت فقط ضد هذا في كروم و الشيء الوحيد الذي كان يعمل إزالة واستبدال iframe.على سبيل المثال:

$(".iframe_wrapper").find("iframe").remove();
var iframe = $('<iframe src="' + src + '" frameborder="0"></iframe>');
$.find(".iframe_wrapper").append(iframe);

بسيطة جدا, لا تغطي في إجابات أخرى.

Answer 8

للحصول على رابط جديد

location.assign("http:google.com");

طريقة تعيين() الأحمال مستند جديد.

تحميل

location.reload();

Reload() يتم استخدام طريقة تحديث الوثيقة الحالية.

Answer 9

صقل على yajra بعد ...أنا أحب التفكير ، ولكن أكره فكرة الكشف عن المتصفح.

أنا أفضل أن ppk رأي باستخدام الكشف عن وجوه بدلا من متصفح الكشف ، (http://www.quirksmode.org/js/support.html), لأن ثم كنت في الواقع اختبار قدرات المتصفح و يتصرف وفقا لذلك ، وليس ما كنت تعتقد المتصفح قادر على في ذلك الوقت.أيضا لا تتطلب الكثير من القبيح هوية المتصفح سلسلة تحليل و لا يستبعد قادرة تماما على المتصفحات التي لا تعرف عنها شيئا

لذا بدلا من النظر إلى الملاح.AppName, لماذا لا تفعل شيئا من هذا القبيل في الواقع اختبار العناصر التي تستخدمها ؟ (يمكن استخدام try {} كتل إذا كنت ترغب في الحصول على حتى مربي الحيوانات ، ولكن هذا عملت بالنسبة لي.)

function reload_message_frame() {
    var frame_id = 'live_message_frame';
    if(window.document.getElementById(frame_id).location ) {  
        window.document.getElementById(frame_id).location.reload(true);
    } else if (window.document.getElementById(frame_id).contentWindow.location ) {
        window.document.getElementById(frame_id).contentWindow.location.reload(true);
    } else if (window.document.getElementById(frame_id).src){
        window.document.getElementById(frame_id).src = window.document.getElementById(frame_id).src;
    } else {
        // fail condition, respond as appropriate, or do nothing
        alert("Sorry, unable to reload that frame!");
    }
}

بهذه الطريقة, يمكنك الذهاب محاولة العديد من التباديل المختلفة كما تريد أو ضروري ، دون أن تسبب أخطاء جافا سكريبت و تفعل شيئا معقولا إذا فشل كل شيء آخر.انها أكثر من ذلك بقليل العمل لاختبار الأشياء الخاصة بك قبل استخدامها ، ولكن المنظمة البحرية الدولية ، يجعل أفضل وأكثر المأمونة الجانب رمز.

عملت بالنسبة لي في IE8, فايرفوكس (15.0.1) والكروم (21.0.1180.89 م) ، الأوبرا (12.0.2) على نظام التشغيل Windows.

ربما أنا يمكن أن تفعل أفضل من ذلك من خلال اختبار تحديث وظيفة ، ولكن هذا يكفي بالنسبة لي الآن.:)

Answer 10

ببساطة استبدال src سمة من عنصر iframe لم يكن مرضيا في حالتي لأن المرء رؤية المحتوى القديم إلى الجديد تحميل الصفحة.هذا يعمل بشكل أفضل إذا كنت تريد أن تعطي ردود الفعل الفورية البصرية:

var url = iframeEl.src;
iframeEl.src = 'about:blank';
setTimeout(function() {
    iframeEl.src = url;
}, 10);

Answer 11

في IE8 باستخدام .صافي, وضع iframe.src لأول مرة على ما يرام ، ولكن الإعداد iframe.src للمرة الثانية هو عدم رفع page_load من iframed الصفحة.لحلها اعتدت iframe.contentDocument.location.href = "NewUrl.htm".

اكتشف ذلك عندما تستخدم مسج thickBox و حاولت فتح نفس الصفحة في thickbox iframe.ثم انها مجرد أظهرت في وقت سابق من الصفحة التي تم فتحها.

Answer 12

استخدام تحديث IE وتعيين src عن المتصفحات الأخرى.(تحديث لا يعمل على FF) اختبار على أي 7,8,9 و فايرفوكس

if(navigator.appName == "Microsoft Internet Explorer"){
    window.document.getElementById('iframeId').contentWindow.location.reload(true);
}else {
    window.document.getElementById('iframeId').src = window.document.getElementById('iframeId').src;
}

Answer 13

هل تعتبر إضافة إلى url بلا معنى سلسلة الاستعلام المعلمة ؟

<iframe src="myBaseURL.com/something/" />

<script>
var i = document.getElementsById("iframe")[0],
    src = i.src,
    number = 1;

//For an update
i.src = src + "?ignoreMe=" + number;
number++;
</script>

أنه لن ينظر & إذا كنت على علم المعلمة كونها آمنة ومن ثم ينبغي أن يكون على ما يرام.

Answer 14

إذا كنت تستخدم مسج ثم هناك سطر واحد من رمز.

$('#iframeID',window.parent.document).attr('src',$('#iframeID',window.parent.document).attr('src'));

و إذا كنت تعمل مع نفس الأم ثم

$('#iframeID',parent.document).attr('src',$('#iframeID',parent.document).attr('src'));

Answer 15

الآن لجعل هذا العمل على كروم 66, جرب هذا:

const reloadIframe = (iframeId) => {
    const el = document.getElementById(iframeId)
    const src = el.src
    el.src = ''
    setTimeout(() => {
        el.src = src
    })
}

Answer 16

إذا كان كل ما سبق لا يعمل بالنسبة لك:

window.location.reload();

هذا لسبب تجديد iframe بدلا من كامل النص.ربما لأنها وضعها في الإطار نفسه ، في حين أن كل تلك getElemntById حلول العمل عند محاولة تحديث الإطار من آخر الإطار ؟

أو أنا لا أفهم هذا تماما و الكلام الفارغ, على أي حال هذا عملت لي مثل السحر :)

Answer 17

باستخدام self.location.reload() سيتم تحديث iframe.

<iframe src="https://vivekkumar11432.wordpress.com/" width="300" height="300"></iframe>
<br><br>
<input type='button' value="Reload"  onclick="self.location.reload();" />

Answer 18

<script type="text/javascript">
  top.frames['DetailFrame'].location = top.frames['DetailFrame'].location;
</script> 

Answer 19

إذا حاولت كل من اقتراحات أخرى و لم أستطع الحصول على أي منهم إلى العمل مثل (لا أستطيع), هنا شيء يمكنك محاولة ذلك قد يكون مفيدا.

HTML

<a class="refresh-this-frame" rel="#iframe-id-0">Refresh</a>
<iframe src="" id="iframe-id-0"></iframe>

JS

$('.refresh-this-frame').click(function() {
    var thisIframe = $(this).attr('rel');
    var currentState = $(thisIframe).attr('src');
    function removeSrc() {
        $(thisIframe).attr('src', '');
    }
    setTimeout (removeSrc, 100);
    function replaceSrc() {
        $(thisIframe).attr('src', currentState);
    }
    setTimeout (replaceSrc, 200);
});

---

أنا وضعت في البداية إلى محاولة لإنقاذ بعض الوقت مع RWD و عبر متصفح الاختبار.أردت أن تخلق سريعة الصفحة الذي يضم مجموعة من نوافذ الأطر المدمجة ، نظمت في مجموعات أود أن إظهار/إخفاء في الإرادة.منطقيا كنت تريد أن تكون قادرة على بسرعة وسهولة تحديث أي إطار.

وأود أن أشير إلى أن المشروع أنا أعمل حاليا في استخدام هذا الاختبار السرير هو موقع من صفحة واحدة مع المواقع المفهرسة (مثلا ، مؤشر.html#المنزل).التي قد يكون لها علاقة لماذا لم أستطع الحصول على أي من الحلول الأخرى لتحديث إطار معين.

وقد قلت ذلك, وأنا أعلم أنها ليست أنظف شيء في العالم ، لكنه يعمل لأغراض بلدي.نأمل أن يكون هذا يساعد شخص ما.الآن إذا أنا فقط يمكن معرفة كيفية الحفاظ على iframe من التمرير الصفحة الرئيسية في كل مرة هناك المتحركة داخل iframe...

تحرير: أدركت أن هذا لا "تحديث" iframe مثلما تمنيت انه سيكون.فإنه سيتم تحميل iframe الأولي المصدر على الرغم من.لا تزال لا يمكن معرفة لماذا لم أستطع الحصول على أي من الخيارات الأخرى إلى العمل..

تحديث: السبب في أنني لم أستطع الحصول على أي من الطرق الأخرى إلى العمل لأنني كنت اختبار لهم في الكروم والكروم لن تسمح لك بالوصول إلى iframe المحتوى (شرح: غير أنه من المرجح أن الإصدارات المستقبلية من دعم كروم contentWindow/contentDocument عندما iFrame تحميل ملف html محلي من المحلية html الملف ؟ ) إذا كان لا تنشأ من نفس الموقع (حتى الآن كما فهمت).عند إجراء مزيد من التجارب, لا أستطيع الوصول contentWindow في FF سواء.

عدل JS

$('.refresh-this-frame').click(function() {
    var targetID = $(this).attr('rel');
    var targetSrc = $(targetID).attr('src');
    var cleanID = targetID.replace("#","");     
    var chromeTest = ( navigator.userAgent.match(/Chrome/g) ? true : false );
    var FFTest = ( navigator.userAgent.match(/Firefox/g) ? true : false );      
    if (chromeTest == true) {
        function removeSrc() {
            $(targetID).attr('src', '');
        }
        setTimeout (removeSrc, 100);
        function replaceSrc() {
            $(targetID).attr('src', targetSrc);
        }
        setTimeout (replaceSrc, 200);
    }
    if (FFTest == true) {
        function removeSrc() {
            $(targetID).attr('src', '');
        }
        setTimeout (removeSrc, 100);
        function replaceSrc() {
            $(targetID).attr('src', targetSrc);
        }
        setTimeout (replaceSrc, 200);
    }       
    if (chromeTest == false && FFTest == false) {
        var targetLoc = (document.getElementById(cleanID).contentWindow.location).toString();
        function removeSrc() {
            $(targetID).attr('src', '');
        }
        setTimeout (removeSrc, 100);
        function replaceSrc2() {
            $(targetID).attr('src', targetLoc);
        }
        setTimeout (replaceSrc2, 200);
    }
});

Answer 20

لأغراض التصحيح واحد يمكن فتح وحدة التحكم في تغيير سياق التنفيذ إلى الإطار الذي يريد منتعشة و لا document.location.reload()

Answer 21

حل آخر.

const frame = document.getElementById("my-iframe");

frame.parentNode.replaceChild(frame.cloneNode(), frame);