HTML + SummernoteWYSIWYG:无法使summernote将文本修改应用于我的文本区域

问题描述

这是我第一次尝试将WYSIWYG添加到项目中,但这样做有一些困难。我能够添加summernote并以我的形式查看它,但未对文本区域进行修改被“ summernote” div包围。

相反,当我想写一些文字时,它会像在图片上那样直接在文本区域上方进行书写。我可以对此进行添加修改,但不能全部进行修改,因为并非所有按钮都能正常工作。例如,字体大小和颜色的下拉列表不起作用,并且当我单击颜色以将文本设置为黄色时,我无法取消单击该按钮并将其反转以使文本保持黄色。

我以前看过here,但没有找到解决方案。请帮助我找到此问题的解决方案,我们将不胜感激! 这就是我正在使用的 进口:

 <!-- include summernote css/js -->
    <link href="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.css" rel="stylesheet">
    <link href="//netdna.bootstrapcdn.com/font-awesome/4.0.3/css/font-awesome.min.css" rel="stylesheet">
<!--Summernote Script -->
<script src="https://cdn.jsdelivr.net/npm/summernote@0.8.18/dist/summernote.min.js"></script>

这是我的html

<div class="form-group">
    <label for="editordata">Post Content</label>
         <div id="summernote">
            <textarea maxlength="10000" class="form-control" id="editordata" name="editordata" rows="2" required></textarea>
         </div>
 </div>

以及相关的jQuery

<script>
    $('#summernote').summernote({
  toolbar: [
    // [groupName,[list of button]]
    ['style',['bold','italic','underline','clear']],['font',['strikethrough','superscript','subscript']],['fontsize',['fontsize']],['color',['color']],['para',['ul','ol','paragraph']],['height',['height']]
  ]
});
</script>

这是我的意思的照片。

enter image description here

解决方法

暂无找到可以解决该程序问题的有效方法,小编努力寻找整理中!

如果你已经找到好的解决方法,欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@)