如何在一页中克隆多个summernote文本编辑器

时间:2018-08-02 11:22:52

标签: javascript jquery summernote

大家好,我想在一个页面中使用多个summernote文本编辑器,用户可以在其中创建多个文本编辑器,并使用网络上的一些示例删除该文本编辑器,我可以正常运行,但是当我尝试上传图像时,内容就消失了在第一个中,我不太擅长.js,如果你们有更好的主意或代码来实现这一目标,请帮助我。

    $(document).ready(function() {
        $('.summernote').summernote();
        //$('#summernote').summernote();
    });
$('.multi-field-wrapper').each(function() {
    var $wrapper = $('.multi-fields', this);
    $(".add-field", $(this)).click(function(e) {
        $('.multi-field:first-child', $wrapper).clone(true).appendTo($wrapper).find('input').val('').focus();
    });
    $('.multi-field .remove-field', $wrapper).click(function() {
        if ($('.multi-field', $wrapper).length > 1)
            $(this).parent('.multi-field').remove();
    });
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/css/bootstrap.css" rel="stylesheet">
  <script src="http://cdnjs.cloudflare.com/ajax/libs/jquery/3.2.1/jquery.js"></script> 
  <script src="http://netdna.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.js"></script> 
  <link href="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.9/summernote.css" rel="stylesheet">
  <script src="http://cdnjs.cloudflare.com/ajax/libs/summernote/0.8.9/summernote.js"></script>
<form role="form" action="/wohoo" method="POST">
  <label>Stuff</label>
    <div class="multi-field-wrapper">
      <div class="multi-fields">
        <div class="multi-field">
        <textarea class="summernote" name="stuff[]"></textarea>
          <button type="button" class="remove-field">Remove</button>
        </div>
      </div>
    <button type="button" class="add-field">Add field</button>
  </div>
</form>

并且此代码也无法正常工作,因为我希望出现一些问题,例如第三次单击后编辑器变为空白 谢谢

0 个答案:

没有答案