【问题标题】:wysihtml5 text area resizingwysihtml5 文本区域调整大小
【发布时间】:2013-08-07 04:03:16
【问题描述】:

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

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

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

如果我切换到 html 视图,效果会很好。我想让文本区域在普通文本中调整大小。

【问题讨论】:

  • 解决方案是调整 wysihtml5 编辑器创建的大小。

标签: javascript html editor wysiwyg


【解决方案1】:

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

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

【讨论】:

    【解决方案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"
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2013-03-29
      • 2012-07-09
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      相关资源
      最近更新 更多