忽略\ n在javascript字符串中

时间:2016-06-28 16:53:57

标签: javascript backspace

我有一个将16/06/27 00:54:05 INFO DAGScheduler: Job 0 finished: reduce at SparkPi.scala:36, took 43.165503 s 转换为16/06/28 16:22:49 INFO scheduler.DAGScheduler: Job 0 finished: reduce at SparkPi.scala:36, took 18.264482 s 的基本系统但是当我在变量框中添加\n时,<br/>没有显示,而且没有效果,仅当用户在textarea中添加Hello\nhow are you以在预览框中显示时才有效。如何忽略js vars中的\n

\n

示例:http://image.prntscr.com/image/3312c7182fdf4e1d8a538c941c86bdf7.png

有效,但是如果我添加按钮以将\n添加到js的文本框中则无效。

4 个答案:

答案 0 :(得分:3)

当您只需将whitespace: pre-wrap添加到您显示字符串的CSS规则时,这似乎很有用。

答案 1 :(得分:0)

我写了以下HTML来帮助您了解会发生什么。在下面的示例中,var a是由换行符分隔的两个单词。 Var b将所有新行替换为由空格包围的xyzzy。 Var c将所有新行替换为

如果您只是将字符串写入文档,&lt; br /&gt;在重新格式化和未重新格式化的文本中都被识别。在非格式化任务中,新行将转换为空格而不会出现。但是,在格式化文本中,新行确实会导致换行,因为会保留间距和换行符。

现在我们转到文本类型的输入框。新行是非打印字符,不会显示。 &lt; br /&gt;只是被视为另一段文字而没有经过特殊处理。

接下来我们转到纹理元素。此元素不处理HTML选项,因此&lt; br /&gt;被视为另一段文字。但是,新行字符用于表示textarea元素中的换行符。

如果要删除换行符,只需将其替换为空字符串,方法与用&lt; br /&gt;替换它一样。你不能真正忽略新的行字符。你只需要意识到它们是如何被各种元素处理的。

<!DOCTYPE html>
<html>
<head>
<meta encoding="UTF-8" />
<title>Javascript replace function</title>
<script>
    var a = "first\nsecond";
    var b = a.replace(/\n/, " xyzzy ");
    var c = a.replace(/\n/, "<br />");
</script>
</head>
<body>
   <p>This is a statement to study the Javascript replace function
      with new line characters</p>
   <ul>
      <li>Value a is the string first\nsecond (\n is a new line character)</li>
      <li>Value b has all of the new lines replaced by xyzzy surrounded by spaces</li>
      <li>Value c has all of the new lines replaced by &lt;br /&gt;</li>
   </ul>
<script>
   var a;
   var b;
   var c;
   function starter() {
      var text1 = document.getElementById("text1");
      var area1 = document.getElementById("area1");
      var text2 = document.getElementById("text2");
      var area2 = document.getElementById("area2");
      var text3 = document.getElementById("text3");
      var area3 = document.getElementById("area3");
      text1.value = a;
      area1.value = a;
      text2.value = b;
      area2.value = b;
      text3.value = c;
      area3.value = c;
   }
   function list() {
      document.writeln("<li>Value a " + a + "</li>");
      document.writeln("<li>Value b " + b + "</li>");
      document.writeln("<li>Value c " + c + " </li>");
   }
   window.onload = starter;
</script>
<p>Using Javscript to display variables</p>
<ul>
<script>
   list();
</script>
</ul>
<p>Working with preformatted text</p>
<pre><ul>
<script>
   list();
</script>
</ul></pre>
<form>
   <p>A <input type = "text1" id = "text1" /></p>
   <p>A <textarea id="area1"></textarea> </p>
   <p>B <input type = "text" id = "text2" /></p>
   <p>B <textarea id="area2"></textarea> </p>
   <p>C <input type = "text" id = "text3" /></p>
   <p>C <textarea id="area3"></textarea> </p>
</form>
<script>
   var test1 = /\n/;
   document.writeln("<li>A " + test1.test(a) + "</li>");
   document.writeln("<li>B " + test1.test(b) + "</li>");
   document.writeln("<li>C " + test1.test(c) + "</li>");</script>
</body>
</html>

答案 2 :(得分:0)

如果JavaScript字符串文字中包含\n,则表示换行符,而不是n后面的反斜杠。如果你想要一个反斜杠后跟n,你必须用另一个反斜杠字符来转义反斜杠字符。也就是说,您必须将\\n放在字符串文字中。

当用户按下\n键时,您可以使用以下代码将Enter放入textarea:

$(document).ready(function() {
  function replaceTextareaSelection(textarea, replacement) {
    var text = textarea.value,
      selectionStart = textarea.selectionStart,
      selectionEnd = textarea.selectionEnd;
    textarea.value = text.slice(0, selectionStart) + replacement + text.slice(selectionEnd);
    var selectionIndex = selectionStart + replacement.length;
    textarea.setSelectionRange(selectionIndex, selectionIndex);
  }

  $('#textlabel-input').keydown(function(e) {
    if (e.which == 13) {
      e.preventDefault();
      replaceTextareaSelection(this, '\\n');
    }
  });
});

jsfiddle

这也处理用户在textarea中选择文本并按下Enter键的情况。要对此进行测试,请在jsfiddle的textarea中输入abcdefghi,然后选择def。然后按下Enter键。 textarea的值将更改为abc\nghi,插入符号将位于n之后。

答案 3 :(得分:-1)

我会在字符串上使用正则表达式来实现这个目的:

 var patt1 = /\n/g;
 str.replace(patt1, '<br/>');

它将取代所有换行分隔符。

此处在jsfiddle使用文本区域元素

了解更多here