텍스트 영역 HTML 태그의 한 줄씩 읽는 방법

텍스트 영역 HTML 태그의 한 줄씩 읽는 방법

각 줄에 다음과 같은 정수 값이 포함된 텍스트 영역이 있습니다.

      1234
      4321
     123445

사용자가 다음과 같은 재미있는 값이 아닌 유효한 값을 입력했는지 확인하고 싶습니다.

      1234,
      987l;

그러기 위해서는 텍스트 영역을 한 줄씩 읽고 그것을 검증해야 합니다.자바스크립트를 사용하여 텍스트 영역을 한 줄씩 읽으려면 어떻게 해야 합니까?

이거 먹어봐요.

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
}

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

두 가지 옵션: JQuery가 필요하지 않거나 JQuery 버전

JQuery(또는 기타 필요한 항목) 없음

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 버전

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])
}

---

참고: 각에 대해 원하는 경우 샘플 루프는

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

그러면 의 모든 유효한 숫자 값이 표시됩니다.lines루프를 변경하여 유효성 검사, 잘못된 문자 제거 등 원하는 대로 수행할 수 있습니다.

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

텍스트 영역을 확인하려면 간단한 정규식을 사용하는 것이 좋습니다.

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

단순화된 기능은 다음과 같습니다.

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;
}

아래 HTML 코드의 경우(예만 해당):

<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>

언급URL : https://stackoverflow.com/questions/9196954/how-to-read-line-by-line-of-a-text-area-html-tag