div 클릭시 iframe 및 창 크기 조정

Question

데이터베이스 관리를 위해 Ruby on Rails를 사용하기로 결정한 사람들의 그룹과 크리켓 등록 웹 사이트를 만들고 있습니다. 또한 한 페이지 씩 만들려고하고 있으므로 현재 iFrames에로드중인 등록 양식이 있습니다. 이것이 이상적이지는 않다는 것을 알고 있으며, PHP를 사용하고 있다면 Ajax를 사용할 수 있지만 iFrames를 사용하는 다른 방법은 모른다. 이 어려움은 내부의 버튼을 클릭 할 때 이러한 iFrame의 크기를 조정할 수 없다는 것입니다. 예를 들어 다음과 같습니다.

<div class="links"> 
    <%= link_to_add_association 'Add Player', f, :players %> 
</div> 

"플레이어 추가"라는 '링크'클래스의 버튼입니다. 클릭하면 콘텐츠가 아래쪽으로 확장되어 더 많은 양식이 채워집니다. 그러나 Iframe의 높이가 이미 있으므로 제대로 조정되지 않아 추가 콘텐츠가 숨겨집니다.

나는이 문제를 해결할 수있는 방법이 있습니까? 또는, 한 페이지 측면을 유지하면서 iFrames 사용을 피할 수있는 방법이 있습니까?

건배!

Answer 1

iframe의 기존 높이를 재정의 할 수있는 iframe onload 이벤트가 있습니다. 가정 해 봅시다 : 당신의 자바 스크립트에 다음

<iframe id='stipsImage' onload='iFrameLoaded()' src='http://...' />...</iframe> 

을 :

//apply css on iframe when ready 
iFrameLoaded() { 
    $('#stipsImage').contents().find("body") 
      .append($("<style> " + 
        " body{ text-align: center; } " + 
        " img{ width: 700px; height: 748px; margin: auto; border: 1px solid #ccc } " + 
         "</style> ")); 
    }