JavaScript: Как добавить разрывы строк в текстовую область HTML? - PullRequest
147 голосов
/ 14 мая 2009

Я редактирую текстовую область с помощью JavaScript. Проблема в том, что когда я делаю разрывы строк, они не отображаются. Как я могу это сделать?

Я получаю значение для написания функции, но она не дает разрывов строк.

Ответы [ 9 ]

252 голосов
/ 14 мая 2009

Проблема возникает из-за того, что разрывы строк (\n\r?) Не совпадают с HTML <br/> тегами

var text = document.forms[0].txt.value;
text = text.replace(/\r?\n/g, '<br />');
22 голосов
/ 19 января 2012

, если вы используете общий Java-скрипт и вам нужно присвоить строку значению текстовой области, тогда

 document.getElementById("textareaid").value='texthere\\\ntexttext'.

вам нужно заменить \n или < br > на \\\n

в противном случае выдает Uncaught SyntaxError: Unexpected token ILLEGAL во всех браузерах.

13 голосов
/ 31 мая 2013

Может быть, кто-то найдет это полезным:

У меня была проблема с разрывами строк, которые передавались из серверной переменной в переменную javascript, а затем javascript записывал их в textarea (используя привязки значений knockout.js).

решение было двойным, избегая новых линий:

orginal.Replace("\r\n", "\\r\\n")

на стороне сервера, потому что только с одним escape-символом javascript не обрабатывался.

13 голосов
/ 14 мая 2009

Вам нужно использовать \n для linebreaks внутри textarea

3 голосов
/ 11 июня 2018

Если вы хотите отображать текст на своей странице, вы можете использовать тег <pre>.

document.querySelector('textarea').addEventListener('keyup', function() {
  document.querySelector('pre').innerText = this.value;
});


The
new line will
be respected
3 голосов
/ 14 мая 2009

Новая строка является просто пробелом для браузера и не будет обрабатываться иначе, чем обычный пробел (""). Чтобы получить новую строку, вы должны вставить <BR /> элементов.

Еще одна попытка решить проблему: введите текст в текстовое поле, а затем добавьте JavaScript за кнопкой, чтобы преобразовать невидимые символы во что-то читаемое и вывести результат в DIV. Это скажет вам, чего хочет ваш браузер.

2 голосов
/ 30 марта 2015

У меня есть текстовое поле с идентификатором # infoartist Следуйте:

<textarea id="infoartist" ng-show="dForm" style="width: 100%;" placeholder="Tell your contacts and collectors about yourself."></textarea>

В коде javascript я получу значение textarea и заменим экранированную новую строку (\ n \ r) тегом <br />, например:

var text = document.getElementById("infoartist").value;
text = text.replace(/\r?\n/g, '<br />');

Так что, если вы используете jquery (как я):

var text = $("#infoartist").val();
text = text.replace(/\r?\n/g, '<br />');

Надеюсь, это помогло вам. : -)

0 голосов
/ 24 октября 2014

вот что я сделал для той же проблемы, что и у меня.

когда я передаю текст на следующую страницу в jsp, я читаю его как текстовую область, а не читаю что-то вроде

так что вывод пришел, как вы хотели. а для других свойств вы можете использовать, как показано ниже.

<textarea style="background-color: white; border: none; width:660px;font-family: Arial, Helvetica, sans-serif; font-size:1.0em; resize:none;" name="text" cols="75" rows="15" readonly="readonly" ><s:property value="%{text}"/></textarea>
0 голосов
/ 05 марта 2013

Если вам просто нужно отправить значение testarea на сервер с разрывами строк, используйте nl2br

...