每次保存文件时,换行符和段落都会加倍自己在每次保存后添加额外的空格段和换行符

时间:2014-06-18 10:45:07

标签: javascript jquery html asp.net ckeditor

您好我已经在我的asp.net和vb.net Web应用程序中实现了ckeditor。经过多次努力,其工作正常。

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

如果有一个换行符,则添加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的类

<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文件中复制padte下面的文本。

工作日志 •第一周:简介 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>

每次提交表格后,换行符和段落会翻倍和三倍。

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

----------------- 为什么我的问题与此链接中提出的问题有所不同Removing unwanted newline characters when adding <p> in CKEditor -----------------

该链接中提出的问题并未解释所有细节。在我的问题中,当我能看到这个问题时,我已经清楚地解释了如果他从word文档中复制和发送文本,或者他使用html标签在编辑器中格式化文本,则该人在上述链接中询问该问题。我已经提到了每一个细节,以便回答这个问题的人变得容易。

问题也不同。上述链接中的问题仅涉及由缩进替换的<p>。而在我的情况下,每次换行<br>和段落<p>每次保存文档时都会加倍。我正在从word文档复制文本,并在我的问题中提到它。我在上面提到的链接中没有找到问题的任何细节。

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

上述链接中给出的答案并没有解决我的问题。我必须将每个规则都设置为假,以摆脱问题。而在上述链接的答案中,两条规则被设置为True。 此外,在链接中提到的问题的答案中没有提到函数CKEDITOR.editorConfig = function (config) {。因此,对该链接提出的问题对我没有帮助。

3 个答案:

答案 0 :(得分:6)

我通过在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文件中。

谢谢你的回答。你一直非常乐于助人

答案 1 :(得分:3)

你可以通过以下方式避免这种情况:

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中的Output Formatting

答案 2 :(得分:2)

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

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