【问题标题】:Summernote wysiwyg editor save in codeview not working js/jquerySummernote 所见即所得编辑器保存在代码视图中不起作用 js/jquery
【发布时间】:2017-09-30 10:51:47
【问题描述】:

我使用Summernote 作为所见即所得的编辑器,但我有一个问题。我的大部分文本编辑都在代码视图中进行,问题是如果您在代码视图中提交表单,编辑的文本不会被保存。

出于某种原因,我需要在代码视图和所见即所得视图之间切换以保存已编辑的文本。有人知道如何解决这个问题吗?

我看过这个Not saving content while in code view? #127,但它对我不起作用。

这是我的代码。

$(document).ready(function() {
    $('#desc').summernote({
        height: 1000,                 // set editor height
        minHeight: null,             // set minimum height of editor
        maxHeight: null,             // set maximum height of editor
        focus: true,                  // set focus to editable area after initializing summernote
        codemirror: {
          mode: 'text/html',
          htmlMode: true,
          lineNumbers: true,
          theme: 'monokai'
        },
        callbacks: {
          onBlur: function() {
            //should probably do something here
          },
          onInit: function() {
            console.log('Summernote is launched');
            $(this).summernote('codeview.activate');
          }
        }
    });
});

如果需要这里是html。

<textarea name="desc" id="desc" class="form-control" rows="40"></textarea>

【问题讨论】:

    标签: javascript jquery summernote


    【解决方案1】:

    尝试做这样的事情。

    $(document).on("submit","#my-form-name",function(e){
        $("#desc").val($('#desc').code());
        return true;
    });
    
    $(document).on("submit","#my-form-name",function(e){
        if ($('#desc').summernote('codeview.isActivated')) {
            $('#desc').summernote('codeview.deactivate'); 
        }
    });
    

    【讨论】:

    • 它似乎对我不起作用。问题是如果我尝试在表单提交上加载任何内容,无论我做什么都会返回 true。
    • 尝试使用这个。 if ($('#desc').summernote('codeview.isActivated')) { $('#desc').summernote('codeview.deactivate'); }
    • 我已经编辑了主要答案,您可以将其标记为正确;)
    • 在尝试了许多其他解决方案(例如尝试使用 MutationObservers 检测类更改等)之后,这似乎是唯一可行的解​​决方案。
    【解决方案2】:

    这会将summernote的代码值复制到文本的值中

    $(#desc).on('summernote.blur.codeview', function() {
        $(#desc).val($(desc).summernote('code'));
    });
    

    看起来使用 onblur 回调也可以工作:https://summernote.org/deep-dive/#initialization-options

    【讨论】:

      【解决方案3】:
         $($('.summernote').closest("form")).on("submit",function(e){
              if ($('.summernote').summernote('codeview.isActivated')) {
                  $(".summernote").val($('.summernote').summernote());
                  return true;
              }
              return true;
          });
      
          $($('.summernote').closest("form")).on("submit",function(e){
              if ($('.summernote').summernote('codeview.isActivated')) {
                  $('.summernote').summernote('codeview.deactivate'); 
              }
          });
      

      【讨论】:

      • 您的答案可以通过额外的支持信息得到改进。请edit 添加更多详细信息,例如引用或文档,以便其他人可以确认您的答案是正确的。你可以找到更多关于如何写好答案的信息in the help center
      猜你喜欢
      • 2015-09-10
      • 2014-10-17
      • 2015-07-21
      • 1970-01-01
      • 2012-04-15
      • 2015-05-22
      • 2015-01-14
      • 2011-01-12
      • 1970-01-01
      相关资源
      最近更新 更多