summernote airMode 在 div 中无法正常工作

Question

只是想知道为什么顶部 div 中的 airMode 有效，但在我生成的中却无效？

html:

 <div id="airnote">
 Initialized with airMode </div>
 <div>
 <input type="text" id="textbox" /><a href="#" id="change">Change</a>
 </div>

javascript:

$('#airnote').summernote({airMode: true
});
$('#div1').summernote({
airMode: true
});
var textbox = $("#textbox");
var div1 = $("<div id='div1'>Initialized with airMode</div>");
$("#change").click(function() {
if ($("#textbox").length === 1) {
div1.val(textbox.val());
textbox = textbox.replaceWith(div1);
} else {
textbox.val(div1.val());
div1 = div1.replaceWith(textbox);
}
});

jsfiddle

Answer 1

那是因为当你在上面初始化summernote时#div1不存在。添加新元素后需要初始化 summernote:

$("#change").click(function() {
if ($("#textbox").length === 1) {
 div1.val(textbox.val());
 textbox = textbox.replaceWith(div1);
  $('#div1').summernote({
     airMode: true
 });
} else {
 textbox.val(div1.val());
 div1 = div1.replaceWith(textbox);
}});