javascript - How to read line by line of a text area HTML tag - Stack Overflow

admin管理员组

文章数量:1134243

I have a text area where each line contains Integer value like follows

      1234
      4321
     123445

I want to check if the user has really enetered valid values and not some funny values like follows

      1234,
      987l;

For that I need to read line by line of text area and validate that. How can i read line by line of a text area using javascript?

I have a text area where each line contains Integer value like follows

      1234
      4321
     123445

I want to check if the user has really enetered valid values and not some funny values like follows

      1234,
      987l;

For that I need to read line by line of text area and validate that. How can i read line by line of a text area using javascript?

• javascript
• jquery
• html
• textarea

Share Improve this question Follow edited Sep 17, 2018 at 12:47 yPhil 8,34755 gold badges6161 silver badges9191 bronze badges asked Feb 8, 2012 at 16:04 Saurabh KumarSaurabh Kumar 16.6k4949 gold badges140140 silver badges218218 bronze badges 2

• 2 I'm not 100% sure (hence the comment) but it may involve splitting the text at every "\n" – Pluckerpluck Commented Feb 8, 2012 at 16:05
• 1 possible duplicate of parse a textarea in substrings based on line breaks in Javascript – Michael Berkowski Commented Feb 8, 2012 at 16:06

Add a comment  | 

6 Answers 6

Sorted by: Reset to default 200

Try this.

var lines = $('textarea').val().split('\n');
for(var i = 0;i < lines.length;i++){
    //code here using lines[i] which will give you each line
}

This works without needing jQuery:

var textArea = document.getElementById("my-text-area");
var arrayOfLines = textArea.value.split("\n"); // arrayOfLines is array where every element is string of one line

Two options: no JQuery required, or JQuery version

No JQuery (or anything else required)

var textArea = document.getElementById('myTextAreaId');
var lines = textArea.value.split('\n');    // lines is an array of strings

// Loop through all lines
for (var j = 0; j < lines.length; j++) {
  console.log('Line ' + j + ' is ' + lines[j])
}

JQuery version

var lines = $('#myTextAreaId').val().split('\n');   // lines is an array of strings

// Loop through all lines
for (var j = 0; j < lines.length; j++) {
  console.log('Line ' + j + ' is ' + lines[j])
}

---

Side note, if you prefer forEach a sample loop is

lines.forEach(function(line) {
  console.log('Line is ' + line)
})

This would give you all valid numeric values in lines. You can change the loop to validate, strip out invalid characters, etc - whichever you want.

var lines = [];
$('#my_textarea_selector').val().split("\n").each(function ()
{
    if (parseInt($(this) != 'NaN')
        lines[] = parseInt($(this));
}

A simple regex should be efficent to check your textarea:

/\s*\d+\s*\n/g.test(text) ? "OK" : "KO"

A simplifyied Function could be like this:

function fetch (el_id, dest_id){
var dest = document.getElementById(dest_id),
texta = document.getElementById(el_id),
val = texta.value.replace(/\n\r/g,"<br />").replace(/\n/g,"<br />");
dest.innerHTML = val;
}

for the html code below (as an example only):

<textarea  id="targetted_textarea" rows="6" cols="60">
  At https://www.a2z-eco-sys.com you will get more than what you need for your website, with less cost:
1) Advanced CMS (built on top of Wagtail-cms).
2) Multi-site management made easy.
3) Collectionized Media and file assets.
4) ...etc, to know more, visit: https://www.a2z-eco-sys.com
  </textarea>
  <button onclick="fetch('targetted_textarea','destination')" id="convert">Convert</button>

<div id="destination">Had not been fetched yet click convert to fetch ..!</div>

本文标签： javascriptHow to read line by line of a text area HTML tagStack Overflow