wysihtml5文本区域调整大小

wysihtml5 text area resizing

本文关键字：调整 区域 文本 wysihtml5      更新时间：2023-09-26

我使用的是wysihtml5编辑器，简单的编辑器示例

http://xing.github.io/wysihtml5/examples/simple.html

一切都很好，除了我试图调整文本区域的宽度和高度。

如果我切换到html视图，效果会很好。我想允许在正常文本中调整文本区域的大小。

编辑器加载后，自行更改编辑器的css；

jQuery(document).ready(function() {  
    $('.wysihtml5-sandbox').css("resize", "both");
}

刚刚发现这个简单的解决方案适用于wysihtml5-0.3.0.js

<style>
textarea { ... min-height:500px; }
</style>
<textarea><?php echo $doc2edit; ?></textarea>
<script>
window.onload = function() {
  resizeEditor(); // resize iframe containing HTML tags
}
function getElementsByClass(node,searchClass,tag) {
  var classElements = new Array();
  var els = node.getElementsByTagName(tag); 
  var elsLen = els.length;
  var pattern = new RegExp("''b"+searchClass+"''b");
  for (i = 0, j = 0; i < elsLen; i++) {
   if ( pattern.test(els[i].className) ) {
       classElements[j] = els[i];
       j++;
  } } return classElements; 
}
function resizeEditor(){
  // resize elem with class 'wysihtml5-sandbox' 
  var el = getElementsByClass(document,'wysihtml5-sandbox','*');
  for (i = 0; i < el.length; i++) {
  el[i].style.height = (editor.composer.commands.doc.body.clientHeight+20)+"px";
  }
}
</script>

以及在wysihtml5-0.3.0.js:中

BOX_FORMATTING = [
 ...., "min-height"
相关文章：