텍스트 영역 높이에서 TinyMCE 입력 높이 변경

Question

내 양식에서 입력 및 텍스트 영역을 사용합니다.이 중 일부는 TinyMCE 요소로 추가했습니다. 문제는 입력이 텍스트 영역과 동일한 크기로 변환된다는 것입니다. 입력이 TinyMCE가 아닌 입력 필드와 동일한 높이가되도록하고 싶습니다. (TinyMCE의 최신 버전 인 3.5b2를 사용하고 있습니다.) 예를 들어

는 TinyMCE에는 입력과 텍스트 영역이 테이블을 추가합니다

<table role="presentation" id="teaser_tbl" class="mceLayout" cellspacing="0" cellpadding="0" style="width: 590px; height: 100px; ">

는 어떻게 입력을 30 픽셀하기 위해 높이를 줄이기 위해이 포함 된 스타일을 변경할 수 있습니까?

나는 TinyMCE 포럼에서도 posted this을 사용했습니다.

Answer 1

<table role="presentation" id="teaser_tbl" class="mceLayout" cellspacing="0" cellpadding="0" style="width: 590px; height: 100px; "> 

정확하게 변경해야하는 요소입니다. Tinymce에는 width와 height init 매개 변수가 있지만이 설정이 충분하지 않은 경우가 있습니다. 편집기 iframe이 명시 적으로 동일한 높이를 할당 받음으로 인해 iframe도 조정해야합니다. 전화해야합니다

var new_val = '30px'; 

// adjust table element 
$('#' + 'my_editorid' + '_tbl').css('height', new_val); 

//adjust iframe 
$('#' + 'my_editorid' + '_ifr').css('height', new_val); 

Idealy,이 작업은 편집기 초기화시 바로 수행해야합니다. 그래서 사용

tinyMCE.init({ 
    ... 
    setup : function(ed) { 
     ed.onInit.add(function(ed, evt) { 

     var new_val = '30px'; 

     // adjust table element 
     $('#' + ed.id + '_tbl').css('height', new_val); 

     //adjust iframe 
     $('#' + ed.id + '_ifr').css('height', new_val); 
     }); 
    } 
}); 

업데이트 : jQuery를하지 않고 솔루션 :

tinyMCE.init({ 
    ... 
    setup : function(ed) { 
     ed.onInit.add(function(ed, evt) { 

      var new_val = '30px'; 

      // adjust table element 
      var elem = document.getElementById(ed.id + '_tbl'); 
      elem.style.height = new_val; 

      // adjust iframe element 
      var iframe = document.getElementById(ed.id + '_ifr'); 
      iframe.style.height = new_val; 
     }); 
    } 
});