代码之家  ›  专栏  ›  技术社区  ›  Nathan Osman

如何将ckeditor配置为不在<p>块中包装内容?

  •  47
  • Nathan Osman  · 技术社区  · 14 年前

    我正在使用 ckeditor 在我的网站上,以方便用户输入HTML。

    但是,我从ckeditor得到的数据 <p></p> 积木(我不想要。)

    6 回复  |  直到 5 年前
        1
  •  131
  •   codewaggle    7 年前

    将以下内容添加到 配置.js

    config.enterMode = CKEDITOR.ENTER_BR;
    

    例子:

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

    控制此行为的配置设置基于用户按下时希望发生的操作 输入 .

    为了以防万一,一个刚接触HTML的人读到了这篇文章,我将介绍一些相关概念的基本解释,以及为什么在使用HTML时需要插入一个标记 输入

    以下HTML:

    qwer
    tyui
    

    将呈现为:

    奎伊

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

    config.enterMode 它提供了三种选择:

    1-插入段落

    输入 按下:

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

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

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

    3-插入打断(您要查找的设置)

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

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

    The CKEditor documentation indicates that using the ENTER_BR setting is not recommended :

    注意:建议使用 CKEDITOR.ENTER_P

    另一个相关设置“autoParagraph”

    还有第二个设置可以控制类似的情况 config.autoParagraph . 它的功能取决于 配置模式

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

    <span>asdfg</span>
    

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

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

    如果将此设置为 false 或者如果你 CKEDITOR.ENTER_BR .

    The CKEditor documentation includes this note about config.autoParagraph

    注意:更改默认值可能会带来不可预知的可用性问题。

    更多设置

    还有三种设置与此主题有些关联:

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

    参考

    以下是可用配置选项的完整列表:

        2
  •  17
  •   MikeBman    12 年前

    我知道我比赛有点晚了,但我认为OP想要的选择是:

        config.autoParagraph = false;
    
    
        3
  •  5
  •   ablueman    11 年前

    上面已经很好地回答了这个问题,但是正如前面提到的,您不应该在主配置中真正地更改它。

        <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>
    
        4
  •  5
  •   Xpleria Dholu    10 年前

    一个非常简单的解决方案是使用

    1. shift + enter 换行符 <br> ,和
    2. 只是 进入 会引起一个新的段落。

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

        5
  •  3
  •   Gogol LR Soni    7 年前

    <p> 在Ckeditor中标记并只需要粗体斜体上标下标等基本编辑工具,然后执行以下步骤:

    我100%确信这一点,因为我连续研究了36个小时:)

    步骤1:在PHP网页中添加此脚本

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

    第二步:添加 id="editor2" onfocus="this.value='';" 在你的文本区像这样

    <textarea id="editor2" name="AsYourWish" onfocus="this.value='';">
    

    Class="ckeditor" 从文本区域。

    第五步:完成:)

        6
  •  0
  •   Ravi Dhiman    6 年前

    Django-ckeditor settings.py 文件:

    ENTER_P    = 1 # default
    ENTER_BR   = 2
    ENTER_DIV  = 3
    
    CKEDITOR_CONFIGS = {
        'default': {
            'enterMode': ENTER_BR,
        },
    }
    
        7
  •  -1
  •   Shamseer Ahammed    4 年前

    ,不查找此选项。他们有

    恐怕你不会喜欢它,但enter mode BR是根

    相关GitHub issue

    推荐文章