为了账号安全,请及时绑定邮箱和手机立即绑定

Javascript 函数:使用换行符作为 \n 而不是实际呈现它们

Javascript 函数:使用换行符作为 \n 而不是实际呈现它们

紫衣仙女 2022-09-23 09:43:07

我正在开发一个从文本区域输入接收文本的函数,目的是保留换行符。然后,该函数将文本作为函数的参数,例如:。从文本区域接收的值为:function get_text(val){ ... }


$('#textarea').val();

这样,在单击按钮时,文本区域中的值将传递给函数,例如:get_text()


$('#button').click(function(){

    get_text($('#textarea').val());

});

然后,该函数旨在使用由于值来自文本区域而保留的换行符。但问题出在哪里,当我将 textarea 的值传递给函数时,我在控制台中收到一个错误,指出:意外的标识符,因为参数已被拆分为几行,例如:get_text()


如果输入中的文本是:(第 1 行)我的(第 2 行)文本(第 3 行)是 (第 4 行)此处


该函数获取文本并输出换行符:


get_text("My   --- (×)Error appears here

text

is

here");

我试图在遇到每个换行符后执行某些任务的函数中使用来自 textarea 的换行符,因此除非有其他方法来执行任务,否则删除换行符不是一个选项。


这里唯一的问题是实际上将文本传递到函数中,例如:


get_text($('#textarea').val());

--- should result to ---

get_text('My\ntext\nis\nhere');

--- instead of actually outputting the newlines ---

这与该功能配合得很好。有没有办法在不打印换行符的情况下将文本传递给函数,而是将它们显示为\n?


这是get_text函数:


function get_text(val){

let n = /[\n]/;

let i;

let inner = [];

for(i = 0; i < val.length; i++){

inner.push('<span>' + val[i] + '</span>';

if(n.test(val[i]) == true){

inner.push('<span class="newline">' + val[i] + '</span>';

}

}

return inner.join("");

}

同样,问题甚至不在函数中,只有当值传递给函数时,它才会被拆分成行...不,我没有使用eval


是的,我只有在从表单中获取错误后才收到错误

http://img4.sycdn.imooc.com/632d104a0001219503540142.jpg

查看完整描述

2 回答

?
呼如林

TA贡献1477条经验 获得超3个赞

您可以简单地将它们替换为反斜杠()和字面上的字符。\n

要在文字中创建 ,请用自身转义它,即 .\\\

所以

$('#textarea').val().replace(/\n/g, '\\n')


查看完整回答
反对 回复 2022-09-23
?
天涯尽头无女友

TA贡献0条经验 获得超9个赞

模板文本

模板文字语法允许字符串使用 ' 反引号作为容器跨越多行,这应该可以避免您的问题。我仍然建议转义字符串和/或不要混合服务器端模板代码和JavaScript代码,特别是不要将表单数据逐字嵌入为JS代码。您至少可以使用或类似的东西对其进行序列化。json_encode


您还可以使用表单数据,然后使用它。JSON.stringifyJSON.parse


let val = `My

test

is

here`;


get_text(`My

text

is

here`);

你错过了帕伦斯,你没有使用正确的。它采用字符串,而不是布尔比较,如果匹配,则返回布尔值。

另外,如果你想要换行符,你应该使用。在 a 中放置换行符只会崩溃。它不会在呈现的输出中插入换行符。除非您使用某种CSS样式,例如为您执行换行符的浮点换行符。.test<br><span>


function get_text(val) {

  let n = /[\n]/;

  let i;

  let inner = [];

  for (let i = 0; i < val.length; i++) {

    inner.push('<span>' + val[i] + '</span>');

    if (n.test(val[i])) {

      inner.push('<span class="newline">' + val[i] + '</span>');

    }

  }

  return inner.join("");

}


console.log(

  content.innerHTML = get_text(`My

text

is

here`)

)

.newline::after {

  content: '\\n'

}

<div id="content"></div>


查看完整回答
反对 回复 2022-09-23
  • 2 回答
  • 0 关注
  • 9 浏览
慕课专栏
更多

添加回答

举报

0/150
提交
取消
意见反馈 帮助中心 APP下载
官方微信