Tải lại iframe bằng jQuery

Tôi có hai iframe trên một trang và một thay đổi cho trang kia nhưng iframe khác không hiển thị thay đổi cho đến khi tôi làm mới. Có cách nào dễ dàng để làm mới iframe này với jQuery không?

<div class="project">
  <iframe id="currentElement" class="myframe" name="myframe" src="http://somesite.com/something/new"></iframe>
</div>

Nếu iframe không nằm trên một tên miền khác, bạn có thể làm một cái gì đó như thế này:

document.getElementById(FrameID).contentDocument.location.reload(true);

Nhưng vì iframe nằm trên một tên miền khác, bạn sẽ bị từ chối truy cập vào thuộc tính của iframe contentDocumentbởi chính sách cùng nguồn gốc .

Nhưng bạn có thể buộc mạnh mẽ vào iframe tên miền chéo để tải lại nếu mã của bạn đang chạy trên trang mẹ của iframe, bằng cách đặt thuộc tính src thành chính nó. Như thế này:

// hackishly force iframe to reload
var iframe = document.getElementById(FrameId);
iframe.src = iframe.src;

Nếu bạn đang cố tải lại iframe từ iframe khác, bạn không gặp may, điều đó là không thể.

$( '#iframe' ).attr( 'src', function ( i, val ) { return val; });

bạn cũng có thể sử dụng jquery. Đây giống như những gì Alex đề xuất khi sử dụng JQuery:

 $('#currentElement').attr("src", $('#currentElement').attr("src"));

Tải lại iframe bằng jQuery

tạo một liên kết bên trong iframe cho phép nói với id = "tải lại" sau đó sử dụng mã sau

$('#reload').click(function() {
    document.location.reload();
});

và bạn tốt để đi với tất cả các trình duyệt.

Tải lại iframe bằng HTML (không yêu cầu Java Script)

Nó có giải pháp đơn giản hơn: hoạt động mà không cần javaScript trong (FF, Webkit)

chỉ cần tạo một neo trongSide iframe của bạn

   <a href="#" target="_SELF">Refresh Comments</a>

Khi bạn nhấp vào neo này, nó chỉ cần làm mới iframe của bạn

Nhưng nếu bạn có tham số gửi đến iframe của bạn thì hãy làm như sau.

  <a id="comnt-limit" href="?id=<?= $page_id?>" target="_SELF">Refresh Comments</a>

không cần bất kỳ url trang nào vì -> target = "_ TỰ" làm điều đó cho bạn

với jquery bạn có thể sử dụng điều này:

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

Chỉ cần đáp lại câu trả lời của Alex nhưng với jQuery

var currSrc = $("#currentElement").attr("src");
$("#currentElement").attr("src", currSrc);

Đây là một cách khác

$( '#iframe' ).attr( 'src', function () { return $( this )[0].src; } );

Tôi khá chắc chắn rằng tất cả các ví dụ trên chỉ tải lại iframe bằng src gốc chứ không phải URL hiện tại.

$('#frameId').attr('src', function () { return $(this).contents().get(0).location.href });

Điều đó sẽ tải lại bằng cách sử dụng url hiện tại.

Nếu bạn là tên miền chéo, chỉ cần đặt src trở lại cùng một url sẽ không luôn luôn kích hoạt tải lại, ngay cả khi vị trí băm thay đổi.

Gặp vấn đề này trong khi xây dựng thủ công các nút iframe của Twitter, sẽ không làm mới khi tôi cập nhật các url.

Các nút như Twitter có dạng: .../tweet_button.html#&_version=2&count=none&etc=...

Vì Twitter sử dụng đoạn tài liệu cho url, việc thay đổi hàm băm / đoạn không tải lại nguồn và các mục tiêu nút không phản ánh nội dung được tải ajax mới của tôi.

Bạn có thể nối thêm một tham số chuỗi truy vấn để buộc tải lại (ví dụ: "?_=" + Math.random() nhưng điều đó sẽ lãng phí băng thông, đặc biệt là trong ví dụ này khi cách tiếp cận của Twitter đặc biệt cố gắng kích hoạt bộ đệm.

Để tải lại thứ gì đó chỉ thay đổi bằng thẻ băm, bạn cần xóa phần tử hoặc thay đổi src, đợi luồng thoát ra, sau đó gán lại. Nếu trang vẫn được lưu trong bộ nhớ cache, điều này không cần phải nhấn mạng, nhưng sẽ kích hoạt tải lại khung.

 var old = iframe.src;
 iframe.src = '';
 setTimeout( function () {
    iframe.src = old;
 }, 0);

Cập nhật : Sử dụng phương pháp này tạo ra các mục lịch sử không mong muốn. Thay vào đó, hãy xóa và tạo lại phần tử iframe mỗi lần, nút này giữ cho nút back () này hoạt động như mong đợi. Cũng tốt đẹp để không có bộ đếm thời gian.

Chỉ cần đáp lại câu trả lời của Alex nhưng với jQuery:

var e = $('#myFrame');
    e.attr("src", e.attr("src"));

Hoặc bạn có thể sử dụng chức năng nhỏ:

function iframeRefresh(e) {
    var c = $(e);
        c.attr("src", c.attr("src"));
}

Tôi hy vọng nó sẽ giúp.

$('IFRAME#currentElement').get(0).contentDocument.location.reload()

Điều này là có thể với JavaScript đơn giản.

• Trong iFrame1, tạo một hàm JavaScript được gọi trong thẻ body onload. Tôi có nó kiểm tra một biến phía máy chủ mà tôi đã đặt, vì vậy nó không cố chạy hàm JavaScript trong iframe2 trừ khi tôi đã thực hiện một hành động cụ thể trong iframe1. Bạn có thể thiết lập chức năng này dưới dạng một chức năng được kích hoạt bằng cách nhấn nút hoặc tuy nhiên bạn muốn trong iframe1.
• Sau đó, trong iframe2, bạn có chức năng thứ hai tôi liệt kê bên dưới. Hàm trong iframe1 về cơ bản đi đến trang mẹ và sau đó sử dụng window.framescú pháp để kích hoạt một hàm JavaScript trong iframe2. Chỉ cần đảm bảo sử dụng id/ nameof iframe2 chứ không phải src.

//function in iframe1
function refreshIframe2()
{
    if (<cfoutput>#didValidation#</cfoutput> == 1)
    {   
         parent.window.frames.iframe2.refreshPage();
    }
}

//function in iframe2
function refreshPage()
{   
    document.location.reload();
}

// làm mới tất cả iframe trên trang

var f_list = document.getElementsByTagName('iframe');

 for (var i = 0, f; f = f_list[i]; i++) {
                            f.src = f.src;
                        }

    ifrX =document.getElementById('id') //or 
    ifrX =frames['index'];

giải pháp đa trình duyệt là:

    ifrX.src = ifrX.contentWindow.location

điều này đặc biệt hữu ích khi <iframe> là mục tiêu của <form>

GIẢI QUYẾT! Tôi đăng ký stockoverflow chỉ để chia sẻ với bạn giải pháp duy nhất (ít nhất là trong ASP.NET/IE/FF/Chrom) hoạt động! Ý tưởng là thay thế giá trị bên trong của div bằng giá trị bên trong hiện tại của nó.

Đây là đoạn mã HTML:

<div class="content-2" id="divGranite">
<h2>Granite Purchase</h2>
<IFRAME  runat="server" id="frameGranite" src="Jobs-granite.aspx" width="820px" height="300px" frameborder="0" seamless  ></IFRAME>
</div>

Và mã Javascript của tôi:

function refreshGranite() {           
   var iframe = document.getElementById('divGranite')
   iframe.innerHTML = iframe.innerHTML;
}

Hi vọng điêu nay co ich.

Bạn cần sử dụng

[0] .src

để tìm nguồn của iframe và URL của nó cần nằm trên cùng một miền của cha mẹ.

setInterval(refreshMe, 5000);
function refreshMe() {
    $("#currentElement")[0].src = $("#currentElement")[0].src;   
}

bạn có thể làm như thế này

$('.refrech-iframe').click(function(){
        $(".myiframe").attr("src", function(index, attr){ 
            return attr;
        });
    });

Giải pháp dưới đây sẽ hoạt động chắc chắn:

window.parent.location.href = window.parent.location.href;