programing

jQuery를 사용하여 iframe 다시 로드

megabox 2023. 8. 27. 09:02
반응형

jQuery를 사용하여 iframe 다시 로드

페이지에 두 개의 iframe이 있고 하나는 다른 iframe을 변경하지만 다른 iframe은 새로 고칠 때까지 변경 내용을 표시하지 않습니다.이 iframe을 jQuery로 쉽게 새로 고칠 수 있는 방법이 있습니까?

<div class="project">
  <iframe id="currentElement" class="myframe" name="myframe" src="http://somesite.com/something/new"></iframe>
</div>
$( '#iframe' ).attr( 'src', function ( i, val ) { return val; });

iframe이 다른 도메인에 없는 경우 다음과 같은 작업을 수행할 수 있습니다.

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

그러나 iframe이 다른 도메인에 있으므로 iframe에 대한 액세스가 거부됩니다.contentDocument동일 보험 증권에 의한 재산

그러나 코드가 iframe의 상위 페이지에서 실행 중인 경우 src 속성을 자체로 설정하여 교차 도메인 iframe을 강제로 다시 로드할 수 있습니다.다음과 같이:

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

다른 iframe에서 iframe을 다시 로드하려고 하면 운이 좋지 않습니다. 불가능합니다.

당신은 또한 jquery를 사용할 수 있습니다.이것은 Alex가 JQuery를 사용하여 제안한 것과 동일합니다.

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

jquery를 사용하면 다음을 사용할 수 있습니다.

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

jQuery를 사용하여 iframe 다시 로드

iframe 내부에 링크를 만들고 ID가 = "message"라고 말한 다음 다음 코드를 사용합니다.

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

그리고 당신은 모든 브라우저를 사용할 수 있습니다.

HTML로 iframe 다시 로드(Java Script가 필요 없음)

더 간단한 솔루션을 가지고 있습니다: (FF, Webkit)에서 자바스크립트 없이 작동합니다.

그냥 당신의 iframe안에 닻을 내립니다.

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

이 앵커를 클릭하면 iframe을 새로 고칩니다.

그러나 iframe에 파라미터를 전송한 경우에는 다음과 같이 합니다.

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

-> target="_SELF"가 해주기 때문에 페이지 URL이 필요하지 않습니다.

알렉스의 대답에 답하는 것뿐이지만 jQuery로.

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

여기 다른 방법이 있습니다.

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

위의 모든 예는 현재 URL이 아닌 원래의 src로 iframe을 다시 로드할 뿐이라고 확신합니다.

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

현재 URL을 사용하여 다시 로드해야 합니다.

교차 도메인인 경우 위치 해시가 변경되더라도 src를 동일한 URL로 다시 설정하기만 하면 다시 로드가 트리거되지 않습니다.

URL을 업데이트할 때 새로 고쳐지지 않는 iframe을 수동으로 구성하는 동안 이 문제가 발생했습니다.

Twitter like 버튼의 형태는 다음과 같습니다..../tweet_button.html#&_version=2&count=none&etc=...

Twitter는 URL에 문서 조각을 사용하기 때문에 해시/조각을 변경해도 소스가 다시 로드되지 않았고 버튼 대상에 새로운 Ajax가 로드된 콘텐츠가 반영되지 않았습니다.

강제로 다시 로드하기 위한 쿼리 문자열 매개 변수를 추가할 수 있습니다(예:"?_=" + Math.random()그러나 이는 특히 Twitter의 접근 방식이 캐싱을 활성화하려고 했던 이 예에서 대역폭을 낭비하게 됩니다.

해시 태그로만 변경되는 항목을 다시 로드하려면 요소를 제거하거나 다음을 변경해야 합니다.src스레드가 종료될 때까지 기다렸다가 다시 할당합니다.페이지가 여전히 캐시된 경우 네트워크 히트가 필요하지 않지만 프레임 다시 로드를 트리거합니다.

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

업데이트: 이 방법을 사용하면 원하지 않는 기록 항목이 만들어집니다.대신 매번 iframe 요소를 제거하고 다시 만들면 이 뒤로() 버튼이 예상대로 작동합니다.또한 타이머가 없어서 좋습니다.

알렉스의 대답에 jQuery로 답하는 것뿐입니다.

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

또는 작은 기능을 사용할 수 있습니다.

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

도움이 되길 바랍니다.

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

이것은 간단한 자바스크립트로 가능합니다.

  • iFrame1에서는 로드 시 본문 태그에서 호출되는 JavaScript 함수를 만듭니다.제가 설정한 서버 측 변수를 확인하도록 하여 iframe1에서 특정한 조치를 취하지 않는 한 iframe2에서 자바스크립트 기능을 실행하려고 하지 않습니다.당신은 이것을 버튼 누르기 또는 iframe1에서 원하는 대로 실행되는 기능으로 설정할 수 있습니다.
  • 그리고 iframe2에서, 당신은 아래에 나열된 두 번째 기능을 가지고 있습니다. iframe1을 합니다.window.framesiframe2에서 입니다. 그꼭사세요하용냥▁the를 사용하세요.id/name 이 아닌 입니다.src.
//function in iframe1
function refreshIframe2()
{
    if (<cfoutput>#didValidation#</cfoutput> == 1)
    {   
         parent.window.frames.iframe2.refreshPage();
    }
}

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

//페이지에서 모든 iframe 표시

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'];

교차 분석 솔루션은 다음과 같습니다.

    ifrX.src = ifrX.contentWindow.location

이것은 특히 <iframe>이 <form>의 대상일 때 유용합니다.

해결되었습니다! 저는 단지 당신에게 유일한 해결책을 공유하기 위해 (적어도 ASP에서는) 재고 과잉에 등록합니다.NET/IE/FF/Chrome) 작동합니다!이 아이디어는 내부를 대체하는 것입니다.현재 내부에 의한 div의 HTML 값HTML 값입니다.

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>

그리고 내 자바스크립트 코드:

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

이게 도움이 되길 바랍니다.

사용해야 합니다.

.src

iframe의 소스와 해당 URL이 부모의 동일한 도메인에 있어야 합니다.

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

당신은 이렇게 할 수 있습니다.

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

아래 솔루션은 확실히 작동합니다.

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

언급URL : https://stackoverflow.com/questions/4249809/reload-an-iframe-with-jquery

반응형