Question

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

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

一切正常，除了我试图使文本区域的宽度和高度可以调整大小。

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

Answer 1

编辑器加载后自动更改编辑器的css;

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

Answer 2

刚刚发现这个简单的解决方案与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"

wysihtml5文本区域调整大小

2 个答案: