如何配置ckeditor不包含<p>块中的内容？

Question

我在我的网站上使用ckeditor使用户更容易输入HTML.

但是,我从ckeditor获取的数据包含在<p></p>块中.(我不想要.)

是否有一些配置设置强制编辑器不将文本包装在任何内容中？

Answer 1

将以下内容添加到CKEditor 的config.js文件中:

config.enterMode = CKEDITOR.ENTER_BR;

例:

...

CKEDITOR.editorConfig = function (config)
{
    config.enterMode = CKEDITOR.ENTER_BR;

    ...
};

细节

控制此行为的配置设置基于用户按下时要执行的操作Enter.

如果不熟悉使用HTML的人会阅读此内容,我会对所涉及的概念进行一些基本的解释,以及为什么在Enter按下按键时需要插入标记.

我们知道如果我们在HTML文档中输入一些文本然后在新行上添加其他文本,浏览器将不会将文本显示为两行,它将忽略任何回车并将字符之间的多个空格压缩为单个空间.

以下HTML:

qwer
tyui

将呈现为:

qwer tyui

因此编辑器需要插入一个HTML标记来告诉浏览器它应该在新行上显示第二组文本.

控制config.enterMode它的配置设置是,它提供三个选项:

1 - 插入段落

每次Enter按下时,默认设置都会创建一个段落元素:

config.enterMode = CKEDITOR.ENTER_P; // inserts `<p>...</p>`

2 - 插入'div'

您可以选择创建div元素而不是段落:

config.enterMode = CKEDITOR.ENTER_DIV; // inserts `<div></div>`

3 - 插入中断(您正在寻找的设置)

如果您不想将文本包装在任何内容中,可以选择插入换行标记:

config.enterMode = CKEDITOR.ENTER_BR; // inserts `<br />`

CKEditor文档表明ENTER_BR不建议使用该设置:

注意:建议使用该CKEDITOR.ENTER_P设置,因为它具有语义价值和正确性.编辑器针对此设置进行了优化.

另一个相关设置'autoParagraph'

还有第二种设置可以控制类似的情况 - config.autoParagraph.它的功能取决于config.enterMode上面讨论的设置.

autoParagraph确定内联元素是否span包含在由设置指定的块元素(p或div)中enterMode.默认是包装内联元素,因此如果您输入这样的跨度(作为HTML):

<span>asdfg</span>

它将被包装在ap或div元素中,如下所示:

<p><span>asdfg</span></p>

或这个:

<div><span>asdfg</span></div>

如果将此设置为false或设置enterMode为,则不会包装内联元素CKEDITOR.ENTER_BR.

CKEditor文档包含以下关于config.autoParagraph以下内容的说明:

注意:更改默认值可能会引入不可预测的可用性问题.

更多设置

还有三个与此主题有些相关的设置:

• config.fillEmptyBlocks
• config.forceEnterMode
• config.ignoreEmptyParagraph

参考

可在此处找到可用配置选项的完整列表:

• CKEDITOR.config - CKEditor 3 JavaScript API文档
• CKEDITOR.config - CKEditor 4文档

Answer 2

我知道我有点迟到了,但我认为OP正在寻找的选择是:

    config.autoParagraph = false;

Answer 3

这在上面得到了很好的回答,但是正如你所提到的,你不应该在主配置中改变它.

这样做的正确方法是.replace.

即

    <form name="title" method="post" action="<?php echo htmlentities($_SERVER['PHP_SELF']);?>">
    <textarea id="editor2" name="editor2" rows="300"><?php echo $editor2;?></textarea>
    <textarea id="editor1" name="editor1" rows="1" cols="50" onfocus="this.value=''; this.onfocus=null;">Type Tab Title Here:</textarea>
    <input type="submit" value="Submit">
    </form>

<script type="text/javascript">  
    CKEDITOR.replace( 'editor2', { 
    enterMode: CKEDITOR.ENTER_BR, 
    on: {'instanceReady': function (evt) { evt.editor.execCommand('maximize');     }},
    });      
    </script>

Answer 4

没有任何配置更改的非常简单的解决方案是使用

1. shift+ enter换行<br>,和
2. 只是enter将导致一个新的段落.

优点是您不必进行任何配置更改.另外,你有两个.