기록에 추가하지 않고 IFRAME 다시로드
나는 그것을 src
다시로드하기 위해 IFRAME을 변경하고 있으며, 잘 작동 onload
하고 HTML 이로 드 될 때 이벤트를 발생시킵니다.
그러나 그것은 내가 원하지 않는 역사에 항목을 추가합니다. IFRAME을 다시로드하지만 기록에 영향을주지 않는 방법이 있습니까?
javascript를 사용할 수 있습니다 location.replace
.
window.location.replace('...html');
현재 문서를 제공된 URL에있는 문서로 바꿉니다. assign () 메서드와 다른 점은 replace ()를 사용한 후에는 현재 페이지가 세션 기록에 저장되지 않는다는 것입니다. 즉, 사용자가 뒤로 단추를 사용하여 해당 페이지로 이동할 수 없다는 의미입니다.
replace () 사용은 자체 도메인 iframe에 대한 옵션 일뿐입니다. 원격 사이트 (예 : 트위터 버튼)에서 작동하지 않으며 자식 창에 안정적으로 액세스하려면 브라우저 별 지식이 필요합니다.
대신 iframe 요소를 제거하고 동일한 위치에 새 요소를 구성하십시오. 기록 항목은 src
DOM에있는 속성 을 수정 한 경우에만 생성 되므로 추가하기 전에 설정해야합니다.
편집 : JDandChips는 DOM에서 제거하고 수정하고 다시 추가 할 수 있다고 올바르게 언급합니다. 새로 구축 할 필요가 없습니다.
Greg가 위에서 말했듯이 .replace () 함수는이를 수행하는 방법입니다. 그의 답변 *에 응답하는 방법을 알아낼 수없는 것 같지만 트릭은 iFrames contentWindow 속성을 참조하는 것입니다.
var ifr = document.getElementById("iframeId");
ifr.contentWindow.location.replace("newLocation.html");
* 답변에 대해 언급하려면 더 많은 평판이 필요하다는 것을 방금 알게되었습니다.
iframe을 다시 만드는 다른 방법은 DOM에서 iframe을 제거하고 src를 변경 한 다음 다시 추가하는 것입니다.
여러면에서 이것은 replace()
제안 과 유사 하지만 History.js로 이러한 접근 방식을 시도하고 상태를 수동으로 관리 할 때 몇 가지 문제가있었습니다.
var container = iframe.parent();
iframe.remove();
iframe.attr('src', 'about:blank');
container.append(iframe);
한 가지 해결책은 object
태그가 아닌 태그 를 사용하는 것 iframe
입니다.
이것을 대체 :
<iframe src="http://yourpage"/>
이로 인해:
<object type="text/html" data="http://yourpage"/>
data
기록에 영향을주지 않고 속성 을 업데이트 할 수 있습니다 . React.js
DOM을 업데이트하기 위해 명령형 명령을 수행하지 않아야하는 경우 와 같은 선언적 프레임 워크를 사용하는 경우 유용합니다 .
사이의 차이점에 대한 자세한 내용 iframe
과 object
: 다른에 포함 된 웹 페이지에 iframe이 또는 개체 태그의 사용
이 기능을 사용하여 이전 iframe을 이전 iframe에서 복사 한 새 iframe으로 바꾸십시오.
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의 URL이 브라우저 기록에 추가되지 않습니다.
replace
방법을 사용하여 iframe의 URL을 기록에 추가하지 않습니다.
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')
}
가장 간단하고 빠른 로딩 솔루션 페이지 나 프레임을 로딩 할 때 히스토리를 업데이트하지 않기 위해
사용 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');"
어떤 이유로 onload가 iframe에서로드되지 않는 경우 다음과 같은 구문에 window 대신 대상 프레임 이름을 입력합니다.
onload="YourTarget.location.replace ('http://www.YourPage.com');"
참고 : 이 스크립트는 모두를 위해 onclick
, onmouseover
, onmouseout
, onload
및 href="javascript:"
작동합니다.
JDandChips 답변은 교차 원본 iframe (youtube)에서 저에게 효과적이었습니다. 여기에는 바닐라 JS (JQuery 제외)가 있습니다.
const container = iframe.parentElement;
container.removeChild(iframe);
iframe.setAttribute('src', 'about:blank');
container.appendChild(iframe);
참고URL : https://stackoverflow.com/questions/821359/reload-an-iframe-without-adding-to-the-history
'UFO ET IT' 카테고리의 다른 글
GitHub 웹 사이트에서 디렉토리 / 폴더의 이름을 바꾸는 방법은 무엇입니까? (0) | 2020.11.26 |
---|---|
모범 사례 자바 스크립트 및 다국어 (0) | 2020.11.26 |
UIPageViewController, 데이터 소스에서 지정한 순서를 엉망으로 만들지 않고 특정 페이지로 올바르게 점프하려면 어떻게해야합니까? (0) | 2020.11.26 |
phpMyAdmin에 대한 사용자 'root'@ 'localhost'에 대한 액세스 거부 수정 (0) | 2020.11.26 |
선택적 배열이 비어 있는지 확인 (0) | 2020.11.26 |