将变量发送到TinyMCE 4.0，同时在重新初始化浏览器窗口时调整大小

Question

我想知道是否有方法将字符串发送到TinyMCE 4.0的工具栏设置，并在重新调整浏览器窗口大小时重新初始化。

这里我使用“inquire”作为处理变化的脚本，但我不介意任何技术。我尝试了ed.on（'init'）和PreInit，没有任何希望。

只需要发送BAR1和BAR2的更新的变量，并重置编辑

<script> 


    var bar1 =''; 
    var bar2 = ''; 


    _simpleInt = { 
     mode: 'exact', 
     elements: "TEXT_ID", 
     selector: "textarea:not(.advanced-editor)", 
     editor_selector: "simple-editor", 
     theme: "modern", 
     editor_deselector: /(mceNoEditor|NoRichText)/, 
     width: '100%', 
     height: '200', 
     toolbar_items_size: 'small', 
     setup: function (ed) { 
      ed.on('init', function (args) { 

      }); 
     }, 

     plugins: [ 
      "advlist autolink link image lists charmap print preview hr anchor pagebreak spellchecker template", 
      "searchreplace wordcount visualblocks visualchars code fullscreen insertdatetime media nonbreaking", 
      "save table contextmenu directionality emoticons template paste textcolor dotNetImage qrcode youtube autosave" 
     ], 
     toolbar1: bar1, 
     toolbar2: bar2, 
     image_advtab: true 
    } 
    enquire.register("screen and (max-width: 1024px)", { 
     setup: function() { 

     }, 
     match: function() { 
      bar1 = 'bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist | '; 
      bar2 = 'undo redo | cut copy paste | table | emoticonsqrcode image | link unlink anchor qrcode | '; 
      tinymce.EditorManager.execCommand('mceRemoveEditor', false, "TEXT_ID"); 
      tinymce.init(_simpleInt); 
      //alert("a") 
     }, 
     unmatch: function() { 
      bar1 = 'bold italic underline strikethrough | alignleft aligncenter alignright alignjustify | bullist numlist | | ltr rtl | outdent indent | | forecolor backcolor | searchreplace | '; 
      bar2 = 'undo redo | cut copy paste | table | emoticonsqrcode image | link unlink anchor qrcode | hr nonbreaking inserttime | visualchars visualblocks | removeformat restoredraft | '; 
      tinymce.EditorManager.execCommand('mceRemoveEditor', false, "TEXT_ID"); 
      tinymce.init(_simpleInt); 


     } 
    }); 

tinymce.init(_simpleInt); 
</script> 

Answer 1

我已经找到一种方法。我创建了一个CodePen与解决方案。我还使用了一个函数来在调整停止大小后将init延迟。

var myBar1; 
    var myBar2; 

    function iniTinyMce() { 
     if($(window).width() > 1100) { 
      myBar1 = "insertfile undo redo | styleselect | bold italic | alignleft aligncenter alignright alignjustify | bullist numlist outdent indent | link image"; 
      myBar2 = "print preview media | forecolor backcolor emoticons"; 
      setTimeout(function() { 
       tinymce.EditorManager.execCommand('mceRemoveEditor', true, "example"); 
       tinymce.init(_settings); 
      }, 100); 
     } 
     else { 
      myBar1 = "insertfile undo redo | styleselect | bold italic | alignleft aligncenter "; 
      myBar2 = "print preview media | bullist numlist outdent indent | link image"; 
      setTimeout(function() { 
       tinymce.EditorManager.execCommand('mceRemoveEditor', true, "example"); 
       tinymce.init(_settings); 
      }, 100); 
     } 
     var _settings = { 
      selector: 'textarea', 
      height: 500, 
      theme: 'modern', 
      plugins: ['advlist autolink lists link image charmap print preview hr anchor pagebreak', 'searchreplace wordcount visualblocks visualchars code fullscreen', 'insertdatetime media nonbreaking save table contextmenu directionality', 'emoticons template paste textcolor colorpicker textpattern imagetools'], 
      toolbar1: myBar1, 
      toolbar2: myBar2, 
      image_advtab: true, 
      templates: [{ 
       title: 'Test template 1', 
       content: 'Test 1' 
      }, { 
       title: 'Test template 2', 
       content: 'Test 2' 
      }] 
     } 
    } 
    // Init tinyMce on load 
    iniTinyMce(); 

    // After Resize end 
    $(window).bind('resizeEnd', function() { 
     // Init tinyMce 
     iniTinyMce(); 
    }); 

    $(window).resize(function() { 
     if(this.resizeTO) clearTimeout(this.resizeTO); 
     this.resizeTO = setTimeout(function() { 
      $(this).trigger('resizeEnd'); 
     }, 500); 
    });