CODEWITHSUNDEEP
javascripthtml
santosh
santosh

Reputation: 892

How to add multiple line breaks in Javascript

I want when a person adds any list in the first textarea and click button then in next textarea list should have multiple line breaks. My following code only adds one line break. I want it should add 2, 3.. line breaks.

Please refer this image:

enter image description here

Code:

function myFunction() {

document.getElementById('TextInput2').value = document.getElementById('TextInput1').value.replace(/[\r\n]{2,}/g, "\n");

}
<html>
<body>
 

 <textarea autocomplete="off" cols="30" id="TextInput1" name="message" rows="10" style="width: 100%;"></textarea>
 <br><br>
 
 <center><button onclick="myFunction()">Click me</button></center>
 
 <br>
 <textarea autocomplete="off" cols="30" id="TextInput2" name="message" rows="10" style="width: 100%;"></textarea>
  
</body>
</html>

Upvotes: 0

Views: 1353

Answers (1)

collapsar
collapsar

Reputation: 17238

Just specify 2 (or any other number of) line feeds in the replacement string and apply the substitution on occurrences of 1 and more line feeds. The examples assume that a 'line feed' is either \n or the sequence \r\n:

Replace with 2 line breaks

function myFunction() {
    document.getElementById('TextInput2').value =
         document.getElementById('TextInput1').value.replace(/(\r?\n)+/g, "\n\n");
}
<html>
<body>
 

 <textarea autocomplete="off" cols="30" id="TextInput1" name="message" rows="10" style="width: 100%;"></textarea>
 <br><br>
 
 <center><button onclick="myFunction()">Click me</button></center>
 
 <br>
 <textarea autocomplete="off" cols="30" id="TextInput2" name="message" rows="10" style="width: 100%;"></textarea>
  
</body>
</html>

Add 2 line breaks

function myFunction() {
    document.getElementById('TextInput2').value =
         document.getElementById('TextInput1').value.replace(/((\r?\n)+)/g, "$1\n\n");
}
<html>
<body>
 

 <textarea autocomplete="off" cols="30" id="TextInput1" name="message" rows="10" style="width: 100%;"></textarea>
 <br><br>
 
 <center><button onclick="myFunction()">Click me</button></center>
 
 <br>
 <textarea autocomplete="off" cols="30" id="TextInput2" name="message" rows="10" style="width: 100%;"></textarea>
  
</body>
</html>

Upvotes: 1

Related Questions