每当我保存文档编辑器添加额外的空格、段落和换行符时,换行符和段落就会翻倍

line break and paragraph has doubled itself every time I save the document ckeditor adding extra spaces paragraph and line breaks after every saving

本文关键字:换行符 段落 空格 文档 保存 编辑器 添加      更新时间:2023-09-26

嗨,我已经在我的asp.net和vb.net web应用程序中实现了ckeditor。经过一番努力,它的工作状况良好。

但是它在每次保存后都添加了许多换行符和段落(特别是从word文件中复制和粘贴)。编辑器在提交页面后将额外的<br/>放在html中。

如果有一个换行符,则添加4个换行符。如果我提交

xxx<br>yyy 

提交后变成

xxx<br/><br/><br/><br/<br/><br/>yyy

澄清一下,当我们第一次复制粘贴时,我们不会看到这个行为,这个问题只会在随后的编辑/保存中看到。

请告诉我如何处理这件事。这样它就不会在保存表单后添加额外的换行符和段落。

下面是我实现ckeditor的步骤。

1。从链接http://ckeditor.com/download下载ckeditor。我正在使用完整的软件包

2。复制项目文件夹下的整个文件夹。

3。在母版页中增加了以下几行来添加ckeditor

的引用
   <script src="/ckeditor/ckeditor.js" type="text/javascript"></script>
   <script src="/ckeditor/adapters/jquery.js" type="text/javascript"></script>
   <script src="/ckeditor/ckeditor_custom.js" type="text/javascript"></script>

4。更改特定文本区域的类

<textarea runat="server" id="txtDescription" name="txtDescription" class="ckeditor" style="width: 98%; height: 250px;"></textarea>

5。在内容页底部添加了以下javascript函数

$('#' + '<%= btnSave.ClientID%>').mousedown(function () {
    for (var i in CKEDITOR.instances) {
        CKEDITOR.instances[i].updateElement();
    }
});

这它。代码文件

中没有任何更改

这里是btn。Save是提交数据的按钮

为了清楚地描述这个问题,我提供了下面的情况。

假设我要从word文件中复制粘贴以下文本。

工作日志•第一周:介绍o发现网站的位置o开始熟悉网站和门户。

将其粘贴到ck编辑器后,其html源代码如下所示

<p><strong>Working Log</strong></p>
<ol style="list-style-type:lower-roman">
   <li>1<sup>st</sup> Week : Introduction
    <ul style="list-style-type:circle">
        <li>Discovered the location of the website</li>
        <li>Started familiarise with the websites and portal.</li>
    </ul>
   </li>
</ol>

但是当我保存表单并再次打开它时源代码变成了这样

        <p><strong>Working Log</strong></p>
    <p>&nbsp;</p>
    <p>&nbsp;</p>
    <ol style="list-style-type:lower-roman"><br />
        <li>1<sup>st</sup> Week : Introduction<br />
          &nbsp;
        <ul style="list-style-type:circle"><br />
            <li>Discovered the location of the website</li>
            <br />
            <li>Started familiarise with the websites and portal.</li>
           <br />
           <br />
           &nbsp;
        </ul>
        </li>
           <br />
         <br />
        &nbsp;
         </ol>
        <p>&nbsp;</p>
        <p>&nbsp;</p>

每次提交表单后,换行符和段落将加倍或加倍。

让我发疯。请帮助我如何处理这种情况。

-----------------为什么我的问题与此链接中询问的问题不同添加

时删除不需要的换行符在CKEditor-----------------

链接中提出的问题并没有解释所有的细节。在我的问题中,我已经清楚地解释了我什么时候能看到这个问题。这个人在上面提到的链接中问了这个问题,他是否从一个word文档中复制了文本,或者他是否在编辑器中使用了HTML标签来格式化文本。我已经提到了每一个细节,以便于回答问题的人。

问题也不同。上述环节的问题只涉及<p>被缩进取代的问题。而在我的情况下,每次保存文档时,每个换行<br>和段落<p>都会加倍。我从word文档中复制文本,并在我的问题中提到了这一点。我没有在上面提到的链接中找到任何细节问题。

对于不同的编码员,情况是不同的。问这个问题的人没有解释他的编码环境是什么。我在Vb中实现了CKEditor。基于。Net和ASP.net的web应用程序,我在问题中提到过。我还提到了我如何在应用程序中安装编辑器的每个步骤。但是在链接中提问的人没有提供任何细节。同样,尝试他问题中给出的解决方案并没有解决我的问题。所以我把所有的细节都写进了问题里。我的解决方案也不一样。

上述链接给出的答案并没有解决我的问题。为了解决这个问题,我不得不把所有的规则都定为错误。而在上述链接的答案中,有两个规则被设置为True。此外,在链接中提到的问题的答案中没有提到CKEDITOR.editorConfig = function (config) {功能。因此,在那个链接上给出的问题对我没有帮助。

我通过在config.js文件中添加以下代码行来解决这个问题。

CKEDITOR.editorConfig = function (config) {
// Define changes to default configuration here. For example:
// config.language = 'fr';
// config.uiColor = '#AADC6E';
CKEDITOR.on('instanceReady', function (ev) {
    var writer = ev.editor.dataProcessor.writer;
    // The character sequence to use for every indentation step.
    writer.indentationChars = '  ';
    var dtd = CKEDITOR.dtd;
    // Elements taken as an example are: block-level elements (div or p), list items (li, dd), and table elements (td, tbody).
    for (var e in CKEDITOR.tools.extend({}, dtd.$block, dtd.$listItem, dtd.$tableContent)) {
        ev.editor.dataProcessor.writer.setRules(e, {
            // Indicates that an element creates indentation on line breaks that it contains.
            indent: false,
            // Inserts a line break before a tag.
            breakBeforeOpen: false,
            // Inserts a line break after a tag.
            breakAfterOpen: false,
            // Inserts a line break before the closing tag.
            breakBeforeClose: false,
            // Inserts a line break after the closing tag.
            breakAfterClose: false
        });
    }
    for (var e in CKEDITOR.tools.extend({}, dtd.$list, dtd.$listItem, dtd.$tableContent)) {
        ev.editor.dataProcessor.writer.setRules(e, {
            indent: true,
        });
    }

});
}

如果有人遇到同样的问题,就像我一样复制上面的代码,并将其粘贴到ckeditor文件夹中的config.js文件中。

谢谢你的回答。你帮了我很大的忙

你可以这样做:

config.autoParagraph = false;

config.enterMode = CKEDITOR.ENTER_BR;

CKEDITOR.on('txtDescription', function (ev) {
        ev.editor.dataProcessor.writer.setRules('br',
         {
             indent: false,
             breakBeforeOpen: false,
             breakAfterOpen: false,
             breakBeforeClose: false,
             breakAfterClose: false
         });
    });
config.enterMode = CKEDITOR.ENTER_BR;
config.shiftEnterMode = CKEDITOR.ENTER_BR;

,更多信息请参见CKEditor

中的输出格式

您的问题不是CKEditor或其配置。

相反,您应该查看您的服务器代码并删除对nl2br
的调用。