iframe에서 자바 스크립트 함수 호출
iframe
부모 페이지에서 JavaScript 함수를 호출하는 데 문제가 있습니다 . 내 두 페이지는 다음과 같습니다.
mainPage.html
<html>
<head>
<title>MainPage</title>
<script type="text/javascript">
function Reset()
{
if (document.all.resultFrame)
alert("resultFrame found");
else
alert("resultFrame NOT found");
if (typeof (document.all.resultFrame.Reset) == "function")
document.all.resultFrame.Reset();
else
alert("resultFrame.Reset NOT found");
}
</script>
</head>
<body>
MainPage<br>
<input type="button" onclick="Reset()" value="Reset"><br><br>
<iframe height="100" id="resultFrame" src="resultFrame.html"></iframe>
</body>
</html>
resultFrame.html
<html>
<head>
<title>ResultPage</title>
<script type="text/javascript">
function Reset()
{
alert("reset (in resultframe)");
}
</script>
</head>
<body>
ResultPage
</body>
</html>
( document.all
권장되지 않음을 알고 있지만이 페이지는 내부적으로 IE에서만 볼 수 있어야하며 그게 문제라고 생각하지 않습니다.)
재설정 버튼을 누르면 "resultFrame found"및 "resultFrame.Reset NOT found"가 표시됩니다. 프레임에 대한 참조가있는 것 같지만 프레임에서 함수를 호출 할 수 없습니다. 왜 그런가요?
사용하다:
document.getElementById("resultFrame").contentWindow.Reset();
iframe에서 재설정 기능에 액세스하려면
document.getElementById("resultFrame")
코드에서 iframe을 contentWindow
가져 오고 iframe에서 창 개체를 가져옵니다. 자식 창이 있으면 해당 컨텍스트에서 javascript를 참조 할 수 있습니다.
또한 참조 여기에 특히 bobince에서 답을.
문서에서 프레임을 가져 오는 대신 창 개체에서 프레임을 가져 오십시오.
위의 예에서 다음을 변경하십시오.
if (typeof (document.all.resultFrame.Reset) == "function")
document.all.resultFrame.Reset();
else
alert("resultFrame.Reset NOT found");
...에
if (typeof (window.frames[0].Reset) == "function")
window.frames[0].Reset();
else
alert("resultFrame.Reset NOT found");
문제는 iframe 내부의 자바 스크립트 범위가 iframe의 DOM 요소를 통해 노출되지 않는다는 것입니다. 창 개체 만 프레임에 대한 javascript 범위 정보를 포함합니다.
더욱 견고 함을 위해 :
function getIframeWindow(iframe_object) {
var doc;
if (iframe_object.contentWindow) {
return iframe_object.contentWindow;
}
if (iframe_object.window) {
return iframe_object.window;
}
if (!doc && iframe_object.contentDocument) {
doc = iframe_object.contentDocument;
}
if (!doc && iframe_object.document) {
doc = iframe_object.document;
}
if (doc && doc.defaultView) {
return doc.defaultView;
}
if (doc && doc.parentWindow) {
return doc.parentWindow;
}
return undefined;
}
과
...
var el = document.getElementById('targetFrame');
var frame_win = getIframeWindow(el);
if (frame_win) {
frame_win.reset();
...
}
...
요구
window.frames['resultFrame'].Reset();
objectframe.contentWindow.Reset()
먼저 프레임의 최상위 요소에 대한 참조가 필요합니다.
충족되어야하는 가장 중요한 조건은 부모와 iframe이 모두 동일한 출처에 속해야한다는 것입니다. 완료되면 자식은 window.opener 메서드를 사용하여 부모를 호출 할 수 있으며 부모는 위에서 언급 한대로 자식에 대해 동일한 작업을 수행 할 수 있습니다.
When you access resultFrame through document.all it only pulls it as an HTML element, not a window frame. You get the same issue if you have a frame fire an event using a "this" self-reference.
Replace:
document.all.resultFrame.Reset();
With:
window.frames.resultFrame.Reset();
Or:
document.all.resultFrame.contentWindow.Reset();
If you can not use it directly and if you encounter this error: Blocked a frame with origin "http://www..com" from accessing a cross-origin frame. You can use postMessage() instead of using the function directly.
ReferenceURL : https://stackoverflow.com/questions/1600488/calling-javascript-function-in-iframe
'program story' 카테고리의 다른 글
구성 요소가 NgModule의 일부가 아니거나 모듈을 모듈로 가져 오지 않았습니다. (0) | 2020.12.15 |
---|---|
SQL, 보조 숫자 테이블 (0) | 2020.12.15 |
파이썬 : 목록에 사전 추가-동작과 같은 포인터가 보입니다. (0) | 2020.12.15 |
SQL Server에서 날짜 형식을 DD / MMM / YYYY 형식으로 변환 (0) | 2020.12.14 |
내 Mac에서 dex2jar을 사용할 수 없습니다 : 권한이 거부되었습니다. (0) | 2020.12.14 |