新行的正则表达式在 textarea jQuery 中不起作用

Question

我正在尝试将从由多个

\r\n

组成的路由器复制的返回输出转换为新行，以作为带有缩进的漂亮结果配置，供用户从用户界面查看。但是我下面的脚本不起作用。我从谷歌搜索中参考了一些参考资料也无济于事。有人有解决办法吗？目前我正在使用 MacOS 平台和最新的 Chrome 进行开发。

示例输出

{
  "status": "success",
  "output": {
    "ipv4_address": "xxx/xx",
  },
  "ne_response": "... \r\r\n--- {master}\r\nRouter@xyz> show ... inet address xxx/30\r\n\r\n{master}\r\nRouter@xyz> "
}

电流输出（

\r\n

不工作）

html

<textarea class="form-control" id="viewConfig"></textarea>

jQuery（全部不转换为新行）

 $("#viewConfig").on("keyup", function(){
    var vConfig = $("#viewConfig").val().replace(/\r\n|\r|\n/g, "\\n"); // double backslash not working
    var vConfig = $("#viewConfig").val().replace(/\r\n|\r|\n/g, "\n"); // single backslash not working
    $('#viewConfig').html(vConfig);
});

$("#viewConfig").on("keyup", function(){
    var vConfig = $('#viewConfig').val().replace(/\n/g, "\\n"); // double backslash not working
    var vConfig = $('#viewConfig').val().replace(/\n/g, "\n"); // single backslash not working
    $('#viewConfig').html(vConfig);
});

$("#viewConfig").on("keyup", function(){
    var vConfig = $("#viewConfig").val().replace(/[\r\n]+/gm, "
");
    $('#viewConfig').html(vConfig);
});

Answer 1

IIUC，您真正想要做的是用单个

\r

替换多次出现的

\n

或

\n

。您可以使用正则表达式

[\r\n]+

来做到这一点，它将匹配一个或多个

\r

或

\n

字符。然后你可以用一个换行符替换它

"\n"

。请注意，在引用文本区域时，您需要替换

val

，而不是

html

。

在下面的文本框中键入一个字符以查看效果：

$("#viewConfig").val("... \r\r\n--- {master}\r\nRouter@xyz> show ... inet address xxx/30\r\n\r\n{master}\r\nRouter@xyz> ")

$("#viewConfig").on("keyup", function(){
    var vConfig = $(this).val().replace(/[\r\n]+/g, "\n");
    $(this).val(vConfig);
});

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<textarea class="form-control" id="viewConfig" rows="10" cols="30"></textarea>

注意你可以简单地使用

$(this)

来引用事件处理程序中的

$("#viewConfig")

（参见manual）。