click 이벤트가있는 iframe에서 parent로 메시지 보내기

Question

클릭 이벤트를 사용하여 변수를 iframe에서 수신하려고 시도하면 (크로스 도메인) 부모에게 메시지가 전송됩니다. 받는 메시지 정보로 iframe의 높이를 변경하고 싶습니다. 여러 번 시도했지만 아무 것도 효과가 없었습니다.

<script type="text/javascript"> 
jQuery(function($){ 
    $(window).bind('message', function(event){ 
     var height, 
     oEvent = event.originalEvent; 
     if (oEvent.origin != 'http://some-domain-name.com') { 
      return false; 
     } else { 
      $('#autoIframe').css('height' , height + 'px');} 
    }); 
}); 
</script> 

을 그리고 이것은 iframe 대응의 도메인을 사용하여 무엇을 임 :

이

스크립트는 부모에 사용

<script> 
if (top != self) { 
    jQuery(function($) { 
     if (!!window.postMessage) { 
      $('#bestellen_oben').click(function(){ 
       parent.postMessage('5000', '*'); 
      }); 
     } 
    }) 
} 
</script> 

누군가가 생각이 있습니까?

감사합니다.

Answer 1

귀하의 코드는, 다음은 그것이 작동되도록하기 위해 아주 가까이 필요가있다 :

• 로컬 파일을 (난 그냥 무슨 짓을했는지), 크롬의 로컬 파일 정책 의지하여 크롬이를 테스트하는 경우 이것을 허용하지 마라. 그것을 위해 약간의 고침이 있을지도 모른다. 그러나 나는 그것이 무엇인지에 관해 모른다. 가장 간단한 방법은 로컬 웹 서버에서 사용하는 것입니다. 자세한 내용은이 질문을 참조하십시오. Using iframe with local files in Chrome

• "높이"변수가 지정되지 않았습니다. 게시물 메시지의 데이터는 전달하지만 읽지는 않습니다.

• 원본 확인을 더 간단하게하려면 게시물 메시지 원본을 window.location.origin과 비교하십시오.

부모 코드의 작업 버전은 다음과 같습니다

<script type="text/javascript"> 
jQuery(function($){ 
    $(window).bind('message', function(event){ 
     var height, 
     oEvent = event.originalEvent; 
     if (oEvent.origin != window.location.origin) {  // compare against window.location.origin 
      return false; 
     } else { 
      height = parseInt(oEvent.data);     // make sure to assign height 
      $('#autoIframe').css('height' , height + 'px');} 
    }); 
}); 
</script> 

(iframe이 코드는 내가 테스트하는 경우, 변경 사항이 필요하지 않습니다으로-했다.)