我在我的 TinyMCE 中使用自定义模板。单击“模板”按钮后，用户可以选择要插入到编辑器中的引导列布局。
所有插入和布局都可以正常工作。选择模板后，引导行和列被正确添加。
但是，当我在列内编辑文本时，如果按ENTER，tinymce 不会p在div. 它创建了一个div没有引导类的兄弟。
我需要的是：将光标放在bootstrap column. 之后，在按下 后ENTER，它会p在div.
我有一个小提琴要解释：https ://jsfiddle.net/3fd4cn6z/1/
tinymce.init({
selector: "textarea",
menubar: false,
paste_as_text: true,
resize: true,
height: 500,
image_caption: true,
branding: false,
media_dimensions: false,
relative_urls: false,
convert_urls: false,
remove_script_host: false,
keep_styles: false,
plugins: "link,autolink,advlist,paste,lists,textcolor,colorpicker,hr,emoticons,wordcount,image,imagetools,media,template",
toolbar: ["undo redo removeformat styleselect bold italic underline strikethrough | alignleft aligncenter alignright alignjustify pagebreak | bullist numlist outdent | template"],
content_style: ".lws-editor-columns .row .col-xs-12{position:relative}.lws-editor-columns .row .col-xs-12::before{content:'';display:block;position:absolute;height:100%;width:calc(100% - 30px);border:1px dotted gray}.lws-editor-columns .row .col-xs-12 img{max-width:100%;height:auto}",
content_css: "https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap-theme.min.css",
content_css_cors: true,
templates: [{
"title": "2 columns",
"description": "Insert on the page, 2 columns with the same width",
"content": "<div class=\"lws-editor-columns\"><div class=\"row\"><div class=\"col-xs-12 col-sm-12 col-md-6\">Column 1</div><div class=\"col-xs-12 col-sm-12 col-md-6\">Column 2</div></div></div><p></p><p></p><p></p><p></p>"
},
{
"title": "3 columns",
"description": "Insert on the page, 3 columns with the same width",
"content": "<div class=\"lws-editor-columns\"><div class=\"row\"><div class=\"col-xs-12 col-sm-12 col-md-4\">Column 1</div><div class=\"col-xs-12 col-sm-12 col-md-4\">Column 2</div><div class=\"col-xs-12 col-sm-12 col-md-4\">Column 3</div></div></div><p></p><p></p><p></p><p></p>"
},
{
"title": "4 columns",
"description": "Insert on the page, 4 columns with the same width",
"content": "<div class=\"lws-editor-columns\"><div class=\"row\"><div class=\"col-xs-12 col-sm-12 col-md-3\">Column 1</div><div class=\"col-xs-12 col-sm-12 col-md-3\">Column 2</div><div class=\"col-xs-12 col-sm-12 col-md-3\">Column 3</div><div class=\"col-xs-12 col-sm-12 col-md-3\">Column 4</div></div></div><p></p><p></p><p></p><p></p>"
},
{
"title": "6 columns",
"description": "Insert on the page, 6 columns with the same width",
"content": "<div class=\"lws-editor-columns\"><div class=\"row\"><div class=\"col-xs-12 col-sm-12 col-md-2\">Column 1</div><div class=\"col-xs-12 col-sm-12 col-md-2\">Column 2</div><div class=\"col-xs-12 col-sm-12 col-md-2\">Column 3</div><div class=\"col-xs-12 col-sm-12 col-md-2\">Column 4</div><div class=\"col-xs-12 col-sm-12 col-md-2\">Column 5</div><div class=\"col-xs-12 col-sm-12 col-md-2\">Column 6</div></div></div><p></p><p></p><p></p><p></p>"
}
],
});</script>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/tinymce/4.9.4/tinymce.min.js"></script>
<form method="post" action="dump.php">
<textarea name="content"></textarea>
</form>要产生问题，请按照下列步骤操作：
在工具栏中，单击最后一个图标“插入模板”
选择任何模板
您将看到虚线列（一个在另一个之上 - 在小提琴中我无法添加引导类，但在我的代码中，我可以并且这些列并排）
在任何列（在本例中为 ROW）中，将光标放在数字后面并按
ENTER
它不是扩展列（行）并添加一个p，而是创建一个新的兄弟div。如果我按下SHIFT + ENTER它会产生我想要的东西，但是......它不会创建 a p，它只是添加一个br. 这很糟糕，因为如果我想添加ul, 将无法正常工作。尝试添加 aul或将 texto 格式更改为h1.
问题是：有一种方法可以在按下回车后创建一个空白p？
我很感激任何帮助。