我有一个基本的系统来转换\n到<br/>,但是当我从一个变量在框中添加Hello\nhow are you时,\n不显示,这没有效果,只有当用户在文本区域添加\n以在预览框中显示时才有效。如何忽略js vars中的\n?
function convertirDialogo(val_, type) {
val_ = val_.replace(/\\t/g, "<p class=\"create_t\"></p>");
console.log(type);
if (type !== 'DIALOG_STYLE_LIST') {
val_ = val_.replace(/\\n/g, "<br />");
}
for (var i = 0; i < val_.length; i++) {
var _list_created = false;
if (type === 'DIALOG_STYLE_LIST') {
var l_ = val_.charAt(i) == "\\" && val_.charAt(i + 1) == "n";
if (i == 0 && l_ == false) {
val_ = '<li>' + val_;
} else {
if (l_) {
val_ = val_.replace(/\\n/g, '<li>');
}
}
}
var start = i;
var end = i + 7
if (val_.charAt(start) == '{' && val_.charAt(end) == '}') {
var _col = val_.substring(start, end + 1);
var __col = _col.substring(1, _col.length - 1);
val_ = val_.replace(_col, "<span style=\"color: #" + __col + ";\">");
}
}
return val_;
}示例:http://image.prntscr.com/image/3312c7182fdf4e1d8a538c941c86bdf7.png
这是工作,但如果我添加按钮,以添加\n到文本框从js不起作用。
发布于 2016-06-29 01:03:19
当您可以简单地将whitespace: pre-wrap添加到显示字符串的任何位置的CSS规则中时,这似乎是一项很大的工作。
发布于 2016-06-29 02:30:49
我写了下面的html来帮助你理解所发生的事情。在下面的示例中,var a是由换行符分隔的两个单词。Var b将所有新行替换为用空格括起来的xyzzy。Var c将所有新行替换为
。
如果只是将字符串写入文档,则在重新格式化和未重新格式化的文本中都可以识别。在非格式化任务中,新行被转换为空格,并且不会出现。但是,在带格式的文本中,由于保留了空格和换行符,因此新行确实会导致换行。
现在我们转到类型为text的输入框。新行是非打印字符,不会显示。只是将其视为另一段文本,并未经过特殊处理。
接下来,我们转到texture元素。该元素不处理HTML选项,因此被视为另一段文本。但是,换行符用于表示textarea元素中的换行符。
如果要删除换行符,只需将其替换为空字符串,替换方式与替换方式相同。您不能真的忽略换行符。你只需要意识到它们是如何被各种元素处理的。
<!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 <br /></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>
发布于 2016-07-05 00:42:04
当JavaScript字符串文字中有\n时,它表示换行符,而不是后跟n的反斜杠。如果需要反斜杠后跟n,则必须用另一个反斜杠字符转义反斜杠字符。也就是说,您必须将\\n放在字符串文字中。
当用户按下Enter键时,可以使用以下代码将\n放在文本区域中:
$(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');
}
});
});它还处理用户选择了文本区中的文本并按下Enter键的情况。要测试这一点,请在jsfiddle的文本区域中输入abcdefghi并选择def。然后按Enter键。文本区域的值将更改为abc\nghi,并且插入符号将紧跟在n之后。
https://stackoverflow.com/questions/38082068
复制相似问题