jquery iframe 원소와 자체 적응 높이 얻기
10481 단어 jquery
jquery 메서드:
iframe 하위 페이지에서 부모 페이지 요소 가져오기
코드는 다음과 같습니다.
1 $('#objId', parent.document);상위 페이지에서 iframe 하위 페이지에 대한 요소 코드는 다음과 같습니다.
1 $("#objid",document.frames('iframename').document)
2
3 $(document.getElementById('iframeId').contentWindow.document.body).html()iframe에서 body 요소의 내용을 표시합니다.
1 $("#testId", document.frames("iframename").document).html();iframename에서 ID를 "testId"요소로 가져옵니다.
$(window.frames["iframeName"].document).find("#testId").html()부모 창에서 IFRAME의 모든 입력 상자를 선택합니다.
$(window.frames["iframeSon"].document).find(":text");IFRAME에서 작업을 수행하려면 부모 창의 모든 입력 상자를 선택합니다.
$(window.parent.document).find(":text");iframe 프레임의 HTML:
<iframe src="test.html" id="iframeSon" width="700″ height="300″ frameborder="0″ scrolling="auto"></iframe>부모 창에서 IFRAME의 모든 라디오 버튼을 선택합니다.
$(window.frames["iframe1"].document).find("input[@type='radio']").attr("checked","true");IFRAME에서 작업을 수행하려면 부모 창의 모든 라디오 버튼을 선택합니다.
$(window.parent.document).find("input[@type='radio']").attr("checked","true");iframe 프레임의 경우:
<iframe src="test.html" id="iframe1″ width="700″ height="300″ frameborder="0″ scrolling="auto"></iframe>같은 영역 아래에 두 개의 페이지가 있다고 가정하십시오.
index.html 파일에 iframe:
XML/HTML 코드
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title> </title>
</head>
<body>
<iframe src="iframe.html" id="koyoz" height="0" width="0"></iframe>
</body>
</html> iframe.html 내용:
XML/HTML 코드
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<title>iframe.html</title>
</head>
<body>
<div id="test">www.</div>
</body>
</html> iframe 자체 적응 높이:
$("#iPersonalInfo").load(function() {
$(this).height($(this).contents().height());
})주의해야 할 것이 하나 있는데, 나도 디버깅을 할 때 비로소 발견하였는데, 적지 않은 시간을 지체하였다.귀속 이벤트는 iframe가 불러오기 전에 귀속해야 합니다. 그렇지 않으면 실행되지 않습니다.다음은 jQuery,load 이벤트의 개요입니다. 일치하는 요소마다load 이벤트에 처리 함수를 연결합니다.윈도우 대상에 연결되면 창, 프레임, 대상, 이미지 등 모든 내용을 불러온 후에 터치합니다.원소에 귀속되면 원소의 내용을 불러온 후에 터치합니다.주의: 이 요소가 완전히 불러오기 전에load의 처리 함수를 연결해야만 그가 불러온 후에 터치할 수 있습니다.나중에 다시 묶으면 영원히 촉발되지 않을 거예요.그러니 $(document)에 있지 마세요.ready () 에서 load 이벤트를 연결합니다. jQuery는 모든 DOM 불러오기가 끝난 후에 load 이벤트를 연결합니다.
iframe 코드, ID 쓰기 주의
<iframe src="test.html" id="main" width="700" height="300" frameborder="0" scrolling="auto"></iframe>jquery 코드 1:
// ： test.html
$(window.parent.document).find("#main").load(function(){
var main = $(window.parent.document).find("#main");
var thisheight = $(document).height()+30;
main.height(thisheight);
});jquery 코드 2:
// ： iframe
$("#main").load(function(){
var mainheight = $(this).contents().find("body").height()+30;
$(this).height(mainheight);
});이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
jQuery 전후 예이 기사에서는 jquery after() 및 before() 메소드의 예를 볼 것입니다. before() 메서드는 선택한 요소 앞에 지정된 콘텐츠를 삽입합니다. after() 메서드는 선택한 요소 뒤에 지정된 콘텐츠...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
