Javascript 在jQuery终端中回显同一行上的内容

我一直在查阅文档，但什么也没找到。基本上，我试图回应以下内容：

这里

v0.8.7

应该是一个链接，但是当我尝试使用

.echo（string，{raw:true}）

回显字符串时，ASCII艺术会失真：

term.echo(
    '      __ _____                     ________                              __\n'+
    '     / // _  /__ __ _____ ___ __ _/__  ___/__ ___ ______ __ __  __ ___  / /\n'+
    ' __ / // // // // // _  // _// // / / // _  // _//     // //  \\/ // _ \\/ /\n'+
    '/  / // // // // // ___// / / // / / // ___// / / / / // // /\\  // // / /__\n'+
    '\\___//____ \\\\___//____//_/ _\\_  / /_//____//_/ /_/_/_//_//_/ /_/ \\__\\_\\___/\n'+
    '          \\/              /____/                                     <a href="http://terminal.jcubic.pl/" target="_blank" title="jQueryTerminal Website">v'+term.version()+'</a>',
    {raw:true}
);

term.echo(
“\uuuuuuuuuuuuuuuuuuuuuuuuu\n”+
“/////uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu/\n”+
“\uuu////////////\//\/\/\/\/\/\/\/\ n”+
“//////////\uuuuuuuu/////////\uuuuuu///////\//\uuuu\n”+
“\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\+
'          \\/              /____/                                     ',
{raw:true}
);

我尝试使用两个单独的echo调用，但是版本号被推到了一个新行。如何在ASCII艺术的末尾添加版本号，而不将其放入新行

这是我目前的代码：

term.echo(
    '      __ _____                     ________                              __\n'+
    '     / // _  /__ __ _____ ___ __ _/__  ___/__ ___ ______ __ __  __ ___  / /\n'+
    ' __ / // // // // // _  // _// // / / // _  // _//     // //  \\/ // _ \\/ /\n'+
    '/  / // // // // // ___// / / // / / // ___// / / / / // // /\\  // // / /__\n'+
    '\\___//____ \\\\___//____//_/ _\\_  / /_//____//_/ /_/ /_//_//_/ /_/ \\__\\_\\___/\n'+
    '          \\/              /____/                                     '
);
term.echo('<a href="http://terminal.jcubic.pl/" target="_blank" title="jQueryTerminal Website">v'+term.version()+'</a>',{raw:true});

term.echo(
“\uuuuuuuuuuuuuuuuuuuuuuuuu\n”+
“/////uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu/\n”+
“\uuu////////////\//\/\/\/\/\/\/\/\ n”+
“//////////\uuuuuuuu/////////\uuuuuu///////\//\uuuu\n”+
“\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\+
'          \\/              /____/                                     '
);
echo（“”，{raw:true}）；

---

现场演示：
（使用命令

ver

）

好的，这很有趣。基本上，

echo

函数只在几个不同的模式下运行，这些模式不会在

echo

调用中混合使用方法

但是有一种方法可以通过使用

finalize

回调函数有效地完成您想要的任务，如中所述：

finalize-这是一个带有一个参数div的回调函数 容器

这是关键。如果您查看源HTML，它是从

echo

内容输出的，您可以看到它基本上是一堆

元素，宽度为

100%

，其中包含ASCII码

<div style="width: 100%;">&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;__&nbsp;_____&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;________&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;&nbsp;__</div>

所发生的是另一个

被生成，这会将行击倒。因为它是

raw:true

，这意味着它不能与上面的

echo

混合

但通过使用

finalize

并对包含链接的

div

执行操作，您可以执行以下操作：

term.echo('<a href="http://terminal.jcubic.pl/" target="_blank" title="jQueryTerminal Website">v'+term.version()+'</a>',
     { raw:true,
       finalize: function(div) {
          div
         .css("width", "720px")
         .css("text-align", "right")
         .css("margin-top", "-1em")
         ;
       }
     });

term.echo（“”，
{raw:没错，
最终确定：功能（div）{
div
.css（“宽度”，“720px”）
.css（“文本对齐”，“右”）
.css（“页边距顶部“，-1em”）
;
}
});

神奇之处在于所有CSS&jQuery都设置了CSS。宽度设置为

720px

，

文本对齐

设置为立即对齐，然后

页边距顶部

设置为

-1em

，因此该行正好向上推1行。以下是调整到位后的屏幕截图：

因此，无论出于何种目的，它在视觉上看起来都是一样的。这种方法的警告是，你永远无法知道浏览器会如何对待CSS。所以一定要在一些浏览器中测试它。但是如果它阻塞了，只要调整

finalize

中设置的CSS，你就应该能够想出一个跨浏览器运行良好的组合。

通读之后，我设法找到了最终解决方案，而不需要任何额外的CSS

term.echo(
    '      __ _____                     ________                              __\n'+
    '     / // _  /__ __ _____ ___ __ _/__  ___/__ ___ ______ __ __  __ ___  / /\n'+
    ' __ / // // // // // _  // _// // / / // _  // _//     // //  \\/ // _ \\/ /\n'+
    '/  / // // // // // ___// / / // / / // ___// / / / / // // /\\  // // / /__\n'+
    '\\___//____ \\\\___//____//_/ _\\_  / /_//____//_/ /_/_/_//_//_/ /_/ \\__\\_\\___/\n'+
    '          \\/              /____/                                           '.replace(new RegExp(" {" + (term.version().length+1) + "}$"), ''),
    {finalize: function($div){
        $div.children().last().append('<a href="http://terminal.jcubic.pl/" target="_blank" title="jQueryTerminal Website">v'+term.version()+'</a>')
    }}
);

term.echo(
“\uuuuuuuuuuuuuuuuuuuuuuuuu\n”+
“/////uuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuuu/\n”+
“\uuu////////////\//\/\/\/\/\/\/\/\ n”+
“//////////\uuuuuuuu/////////\uuuuuu///////\//\uuuu\n”+
“\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\\+
'\\/\\\\/'.replace（新的RegExp（“{”+（term.version（）.length+1）+“}$”），
{finalize:function（$div）{
$div.children（）.last（）.append（“”）
}}
);

---

使用他提到的

finalize

选项，我能够使用jQuery向上一个

添加一些额外的HTML

---

发生这种情况的原因是\n在html中被忽略，所有空白字符都替换为一个空格。为了在一个回音中包含此内容，请使用

而不是

\n

或用

将每一行包装起来。这就是插入html的工作原理，因为终端只是附加原始数据。另一个选项是使用

finalize

，如其他答案所示，更改文本。

您放置

\n

的位置应允许将所有这些行放在一行上。那么不清楚问题是什么？@JakeGould查看我的编辑。使用

finalize

选项，我找到了一个不需要额外CSS的解决方案。谢谢你的帮助！（顺便说一句，你在“发生了什么”中漏掉了一个“H”）@DJDavid98修复！很高兴这对你有用！记住，如果这个答案对你有帮助，请重新投票。如果答案解决了您的问题，请记住将其作为答案勾选。如果字符串版本更改为

0.10.10

，您将获得不同的版本。在源代码中有这样的代码：

replace（newregexp（“{”+version\u string.length+“}$”）

因此版本总是向右对齐。这是100%不正确的：

“发生这种情况的原因是\n在html中被忽略，所有空白字符都被替换为一个空格。为了在一个回显中包含此内容，请使用
而不是\n或换行
term.echo(
    '      __ _____                     ________                              __\n'+
    '     / // _  /__ __ _____ ___ __ _/__  ___/__ ___ ______ __ __  __ ___  / /\n'+
    ' __ / // // // // // _  // _// // / / // _  // _//     // //  \\/ // _ \\/ /\n'+
    '/  / // // // // // ___// / / // / / // ___// / / / / // // /\\  // // / /__\n'+
    '\\___//____ \\\\___//____//_/ _\\_  / /_//____//_/ /_/_/_//_//_/ /_/ \\__\\_\\___/\n'+
    '          \\/              /____/                                           '.replace(new RegExp(" {" + (term.version().length+1) + "}$"), ''),
    {finalize: function($div){
        $div.children().last().append('<a href="http://terminal.jcubic.pl/" target="_blank" title="jQueryTerminal Website">v'+term.version()+'</a>')
    }}
);