Question

我正在使用带有TinyMCE的BBCode插件，并看到预览和HTML代码之间的换行符不同。

我在编辑器窗口中有以下几行：

This is line one

This is line three

第二行是空的。当我在HTML中查看时，我得到以下内容。

This is line one
This is line three

没有额外的空行。

tinyMCE.init({
    mode : "textareas",
    theme : "advanced",
    plugins : "bbcode",
    entity_encoding : "raw",
    remove_linebreaks : false,
    force_p_newlines : false,
    force_br_newlines : true,
    forced_root_block : ''
});

我错过了什么？

Answer 1

我已使用Firefox 3.5.7和Google Chrome 4.0.223.11在my test page上对其进行了测试。

HTML：

tinyMCE.init({
  theme : "advanced",
  mode : "textareas",
  plugins : "bbcode",
  content_css : "bbcode.css",
  entity_encoding : "raw",
  add_unload_trigger : false,
  remove_linebreaks : false,
  apply_source_formatting : false
});

段落之间的空格可以使用这样的简单CSS（“bbcode.css”）删除：

p {margin:0; padding: 0;}

Answer 2

您可能需要 use the nl2br() function 输出HTML代码：

nl2br - 插入HTML换行符在字符串中的所有换行符之前

或者，您可以将force_p_newlines选项设置为true。

我已经测试过了，你说得对，但这种行为只发生在BBCode插件上。我相信通过使用preformatted : true中的tinyMCE.init选项，您应该能够解决问题。

Answer 3

从TinyMCE配置中，您可以选择新行的优点

http://www.tinymce.com/wiki.php/Configuration3x:force_br_newlines

TinyMCE将强制BR元素换行，而不是插入段落

tinyMCE.init({
    ...
    force_br_newlines : true,
    force_p_newlines : false,
    forced_root_block : '' // Needed for 3.x
});

Answer 4

这是另一种方法。只需更改Enter和Shift + Enter Keys的行为。

ed.onKeyPress.add(
    function (ed, evt) {
            if(evt.shiftKey && evt.keyCode == 13) {
                tinyMCE.execCommand('mceInsertContent', false, '<br><br>');
                tinymce.dom.Event.cancel(evt);
                //alert('shift enter key');
                return;
            } 
            if(evt.keyCode == 13 && !evt.shiftKey) {
                tinyMCE.execCommand('mceInsertContent', false, '<br>');
                tinymce.dom.Event.cancel(evt);
                //alert('enter key');
                return;             
            }                
        });

Answer 5

尝试添加配置对象

valid_elements: 'br'  //and any others that you want

Answer 6

我有同样的问题。这是bbcode插件的解决方案：

forced_root_block : false,
remove_redundant_brs : false,
valid_elements: "br",
verify_html : false,

Answer 7

仅供参考 - 尽管围绕它的政治戏剧是使用标签并且不使用 标签的“正确的事情”，但问题是我在发送内容电子邮件 - 在电子邮件中，我无法控制标签上的CSS（除非我想为每个标签添加内联CSS）。因此，标记为最终用户添加了双线间距。我在我的网站上添加了CSS以删除间距，内容看起来很好。

因此，在使用 代码后，使用转到“正确的方式”，我将再次使用 代码...

Answer 8

使用TinyMCE 4我有同样的问题，但对我来说这个配置

mode: 'exact',
inline: true, 
add_unload_trigger: false, 
schema:"html5", 
invalid_elements: "span", 
extended_valid_elements : "span[!class]", 
paste_remove_styles: true,
forced_root_block : false, 
verify_html : false,
cleanup : true

TinyMCE编辑器中的换行符在预览时显示额外的行，而不是在代码中

8 个答案: