>웹 프론트엔드 >JS 튜토리얼 >동일한 페이지에서 서로 jquery 및 js 함수를 호출하는 두 iframe 문제를 해결하는 방법

동일한 페이지에서 서로 jquery 및 js 함수를 호출하는 두 iframe 문제를 해결하는 방법

高洛峰
高洛峰원래의
2016-12-28 11:08:261405검색

이번 달에는 블로그를 업데이트하지 않았습니다. 오늘은 두 개의 iframe이 서로 jquery 함수 메서드를 호출하는 문제를 해결했습니다.

a.html에 두 개의 iframe이 있습니다.

<iframe width="100%" height="100%" name="left" scrolling="auto" frameborder="0" src="b.html" id="left"></iframe>
<iframe width="100%" height="100%" name="main1" scrolling="auto" frameborder="0" src="c.html" id="main1" ></iframe>

b.html에는 왼쪽 메뉴 iframe이라는 treeview가 있습니다.

c.html은 b에서 treeview를 클릭하면 표시되는 데이터입니다. .html은 오른쪽 페이지 iframe이라고 합니다.

a.html에 존재하는 두 페이지 사이에는 관계가 있으므로 두 페이지는 서로의 Js 메소드를 호출할 수 있습니다.

ps: 두 페이지 사이에 관계가 없으면 서로 호출하기 전에 관계를 갖도록 하십시오. 예를 들어 두 페이지가 모두 js 파일을 참조하면 서로 호출할 수 있습니다.

예를 들어

c.html

<input type="button" id="btn" onclick="btnAlert(i)"/>
<input type="hidden" id="hidVal" name="hidVal" />
function btnAlert(index) {
 $(window.parent.$("#left"))[0].contentWindow.GetIndex(index);//调用b.html中的方法
}

b.html

function GetIndex(index) { 
  $(window.parent.$("#main1")).contents().find("#hidVal").val(index);//找到c.html中的hidVal给他赋值
}

에 버튼이 있습니다. 마지막으로 요약하면

c.html의 iframe이 b.html에 있는 경우

1 메서드를 인용하고 하위 iframe에서 상위 클래스 함수 메서드를 호출합니다.

window.parent .func( );

2, 하위 Iframe에서 상위 인터페이스 요소를 가져옵니다.

$("#xx", window.parent.document);

이 xx는 상위 인터페이스입니다. 검색할 요소의 ID입니다.

3. jquery는 하위 iframe 페이지에서 js 메서드를 호출합니다.

iframefunction()은 하위 페이지

$(window.parent.document의 메서드입니다. ).contents() .find("#iframename")[0].contentWindow.iframefunction();

위 내용은 이 글의 내용 전체입니다. 여러분의 공부나 업무에 도움이 되는 동시에 PHP 중국어 홈페이지도 지원해 주시길 바랍니다!

같은 페이지에서 두 iframe이 서로 jquery와 js 함수를 호출하는 문제를 해결하는 방법에 대한 자세한 관련 기사를 보려면 PHP 중국어 웹사이트에 주목하세요!


성명:
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.