iframe에서 상위 창의 요소에 액세스합니다.

iframe에서 상위 창의 요소에 액세스합니다.

호출할 수 있는 페이지가 있습니다.parent.php이 페이지에는,iframe제출 양식과 그 밖에 ID가 "target"인 div가 있습니다.iframe에서 양식을 제출하고 성공 시 타겟 div를 새로 고칠 수 있습니까?새 페이지를 로딩하거나 뭐 그런 거요?

편집: 타겟 div는 부모 페이지에 있기 때문에 기본적으로 iframe 외부에서 부모에게 jQuery 콜을 할 수 있는지 여부를 묻습니다.어떻게 보일까?

편집 2: 현재 jquery 코드는 다음과 같습니다.iframe 페이지에 있습니다.div #target은 부모에 있습니다.php

$(;"form[name=my_form]").submit(function(e){     
 e.preventDefault; 
 window.parent.document.getElementById('#target'); 
 $("#target").load("mypage.php", function() { 
 $('form[name=my_form]').submit(); 
 }); 
 })

폼은 정상적으로 송신되지만 타겟에는 아무 일도 일어나지 않기 때문에 스크립트가 액티브한지는 알 수 없습니다.

편집 3:

이제 iframe 내의 링크에서 부모 페이지를 호출하려고 합니다.성공도 거두지 못했습니다.

<a href="javascript:window.parent.getElementById('#target').load('mypage.php');">Link</a>

제 생각에 문제는 당신이 요소를 얻기 위한 호출에 "#"이 있기 때문에 요소를 찾을 수 없는 것일 수 있습니다.

window.parent.document.getElementById('#target'); 

jquery를 사용하는 경우 #만 필요합니다.다음과 같습니다.

window.parent.document.getElementById('target'); 

다음과 같이 iframe 내에서 부모 창의 요소에 액세스할 수 있습니다.

// using jquery    
window.parent.$("#element_id");

즉, 다음과 같습니다.

// pure javascript
window.parent.document.getElementById("element_id");

네스트된 iframe이 여러 개 있고 최상위 iframe에 액세스하려면 다음과 같이 사용할 수 있습니다.

// using jquery
window.top.$("#element_id");

즉, 다음과 같습니다.

// pure javascript
window.top.document.getElementById("element_id");

iframe 안에 다음 js를 넣고 ajax를 사용하여 폼을 제출합니다.

$(function(){

   $("form").submit(e){
        e.preventDefault();

       //Use ajax to submit the form
       $.ajax({
          url: this.action,
          data: $(this).serialize(),
          success: function(){
             window.parent.$("#target").load("urlOfThePageToLoad");
          });
       });

   });

});

iframe. window.parent.parent는 부모 페이지의 window 객체를 반환하므로 다음과 같은 작업을 수행할 수 있습니다.

window.parent.document.getElementById('yourdiv');

그럼 그 디바로 하고 싶은 대로 해

언급URL : https://stackoverflow.com/questions/7027799/access-elements-of-parent-window-from-iframe