Summernote 0.8.20 问题 html 文本播种 - 第二次触发 js/jquery 代码时发生错误

Question

我正在使用 Summernote 0.8.20，并尝试根据表字段的选择填充种子文本（即，种子文本根据所选的表单元格而变化）。当我第一次选择触发表单元格（即满足条件的单元格）时，它会起作用。第二次不显示种子文本，并且出现控制台错误：

summernote-bs4.min.js:2 Uncaught TypeError: Cannot read properties of null (reading 'appendChild')

该错误是由以下行引起的：

if ($.inArray(currentColumn, assistArray) > -1) {
    $('#ymSpecificLine').summernote('pasteHTML', '<p><b>How were you involved in reviewing?</b><br><br></p> <p><b>How did you assist?</b><br><br></p> <p><b>How were you involved in planning?</b><br><br></p> <p><b>My role was (what did you do):</b><br><br></p>');
 }else {
     $('#ymSpecificLine').summernote('pasteHTML', '<p><b>How were you involved in reviewing?</b><br><br></p> <p><b>How did you lead?</b><br><br></p> <p><b>How were you involved in planning?</b><br><br></p> <p><b>My role was (what did you do):</b><br><br></p>');
 }

我知道这一点，因为当我将它们注释掉时，不会发生错误。

HTML：

<!-- Modal -->
<div class="modal fade" id="myModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
  <div class="modal-dialog">
    <div class="modal-content">
      <div class="modal-header">
        <button type="button" class="close" data-dismiss="modal" aria-label="Close"><span aria-hidden="true">&times;</span></button>
        <h4 class="modal-title" id="myModalLabel">Assist/Lead Details</h4>
      </div>
      <div class="modal-body">
        <!-- Summernote input area -->
        <div class="row">
            <div class="container-fluid">
                <div id='ymSpecific' class="row">
                    <div class="container-fluid">
                        <div class="input-group">
                            <label for="ymSpecificLine" class="text-left col-lg-12 col-md-12 col-sm-12 col-xs-12 col-form-label">You may enter specific information relating to you Assist or Lead:</label>
                            <div class="col-lg-12 col-md-12 col-sm-12 col-xs-12 text-left">
                                <textarea class="summernote col-lg-12 col-md-12 col-sm-12 col-xs-12" id="ymSpecificLine" name="ymSpecificLine" rows="20"></textarea>
                            </div>
                        </div>
                    </div><!-- /container -->
                </div><!-- /row -->
            </div><!-- /container -->
        </div><!-- /row -->
      </div>
      <div class="modal-footer">
        <button type="button" class="btn btn-default" data-dismiss="modal">Close</button>
        <button type="button" class="btn btn-primary">Clear</button>
        <button type="button" class="btn btn-primary">Save changes</button>
      </div>
    </div>
  </div>
</div>

JS：

var leadArray = [8, 16, 24, 32, 44, 52, 60, 68, 80, 81, 82, 83, 91, 92, 93, 94,
                 102, 103, 104, 105, 113, 114, 115, 116];

var assistArray = [7, 15, 23, 31, 42, 43, 50, 51, 58, 59, 66, 67, 77, 78, 79, 88, 89, 90,
             99, 100, 101, 110, 111, 112];

$("#ymSpecificLine").summernote('code', '');
var currentColumn = parseInt(sel.dataset.column, 10);

//Check if Assist or Lead (requires details to be entered)
alert("New currentColumn: " + currentColumn);
if ($.inArray(currentColumn, assistArray) > -1 || $.inArray(currentColumn, leadArray) > -1){

    $('.summernote').summernote({
        toolbar: [
           // [groupName, [list of button]]
           ['style', ['bold', 'italic', 'underline', 'clear']],
           ['font', ['strikethrough']],
           ['fontsize', ['fontsize']],
           ['color', ['color']],
           ['para', ['ul', 'ol', 'paragraph']],
           ['height', ['height']]
        ]
    });
    
    $("#myModal").modal('show');
    
    if ($.inArray(currentColumn, assistArray) > -1) {
        $('#ymSpecificLine').summernote('pasteHTML', '<p><b>How were you involved in reviewing?</b><br><br></p> <p><b>How did you assist?</b><br><br></p> <p><b>How were you involved in planning?</b><br><br></p> <p><b>My role was (what did you do):</b><br><br></p>');
    }else {
        $('#ymSpecificLine').summernote('pasteHTML', '<p><b>How were you involved in reviewing?</b><br><br></p> <p><b>How did you lead?</b><br><br></p> <p><b>How were you involved in planning?</b><br><br></p> <p><b>My role was (what did you do):</b><br><br></p>');
    }
}

第一次选择的结果：

第二次选择的结果：

Answer 1

我通过注释发现：

$("#ymSpecificLine").summernote('code', '');

控制台错误没有发生；但是，在每个页面重新加载时，种子文本都会重复。这就是为什么这条线首先存在的原因。我发现：

$("#ymSpecificLine").summernote('reset');

这不会导致我收到控制台消息，并且每次重新加载时种子行都不会重复。但是，这也消除了调整文本区域大小的能力。

有没有办法在重置后启用调整大小？