JavaScript: обнаружить пропуск строки в textarea

476
24 ноября 2016, 10:32

Как с помощью JavaScript (если будет проще - то и с подключениемjQuery) обнаружить пропуск строки в <textarea>?

Поясню задачу: нужно, обрабатывая введённые данные в <textarea>, все абзацы, разделяемые пропуском строки, обернуть в <p>. Не нужно приводить полное решение, просто подскажите пожалуйста принцип, принимая во внимание то, как я дальше буду использовать полученное знание.

Answer 1

Вот пример. jquery используется только для получения DOM-объектов по селекторам, так что вы его можете не использовать.

$('textarea').keyup(function() { 
    var val = $(this).val(); 
    var p = function(s) { return '<p>' + s + '</p>'; } 
   
    var content = val 
        .split('\n\n') // разбиваем значение textarea на массив по двум переносам 
        .map(function(item) { return p(item); }) // оборачиваем каждый элемент в тег p 
        .join('') // получаем из элементов массива строку 
        .replace(/\n/g, '<br>'); // заменяем оставшиеся переносы на <br> 
   
    // console.log(content); 
    $('#result').html(content); 
});
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script> 
 
<textarea rows="5" cols="45"></textarea> 
<div id="result"></div>

Answer 2

Вот пример:

var text = ''; 
var area = document.getElementById('text'); 
var review = document.getElementById('review'); 
area.onkeyup = function() { 
  var newtext = area.value; 
  if (newtext != text) { 
    text = newtext; 
    newtext = newtext.replace(/</g, '&lt;') 
                .replace(/>/g, '&gt;') 
                .replace(/\n/g, '</p><p>') 
                .replace(/(<p><\/p>)+/g, '<br>'); 
    review.innerHTML = '<p>' + newtext + '</p>'; 
  } 
}
<form action="" method="post"> 
  <textarea id="text" rows="5" cols="45" name="text"></textarea> 
</form> 
<div id="review"></div>

В нем экранирую только символы < и >, хотя стоит еще и ", ', & экранировать наверное.

READ ALSO
Прокомментируйте код построчно

Прокомментируйте код построчно

Здравствуйте, прошу помочь разобраться и понять следующий примерЯ нуждаюсь в объяснении данного кода, желательно прокомментировать построчно

405
Как отправить на websocket сообщение из node js?

Как отправить на websocket сообщение из node js?

В моем приложении node js понадобилась отправка сообщений на websocketЯ решил что надо написать клиента websocket серверу

546
При нажатии на кнопку открываются все модальные окна сразу (

При нажатии на кнопку открываются все модальные окна сразу (

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

557