テキスト領域のHTMLタグを1行ずつ読み取る方法


92

各行に次のような整数値が含まれるテキスト領域があります

      1234
      4321
     123445

ユーザーが本当に有効な値を入力しているかどうかを確認したいのですが、次のような面白い値ではありません

      1234,
      987l;

そのためには、テキスト領域を1行ずつ読み、それを検証する必要があります。javascriptを使用してテキスト領域を1行ずつ読み取るにはどうすればよいですか?


2
100%確信はありませんが(したがってコメント)、「\ n」ごとにテキストを分割する必要があるかもしれません
Pluckerpluck 2012

回答:


181

これを試して。

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
}

14
使用$('textarea').val()する代わりにdocument.getElementById('textareaId').innerHTMLそれだけです。
ShankarSangoli 2012

3
私たちが使用した別の方法があったことを覚えています。form.elementnameか何かを使用しました。昔のことです。DOMがまったく新しい6〜7年前
SoWhat 2012

はい、document.formname.textareName.valueを使用してアクセスすることもできます
ShankarSangoli 2012

3
行は\ r \ nではなく\ nで終わることが保証されていますか?
オズタコ-モニカCを復活させる。2018年

2020年にここにいる人にとって、上記のコメントが追加されたときのブラウザの動作はわかりませんが、現在Chromeはdocument.getElementById( 'textarea')。innerHTMLを認識しません。ただし、プレースホルダーテキストとして既に読み込まれている場合を除きます。 DOMの元のロードで。ユーザーが入力または変更したテキストにアクセスするには、document.getElementById( 'textarea')。valueを使用する必要があります。ページの読み込み時に、プレースホルダーテキストは<textarea> </ textarea>タグの間に内部HTMLとして配置されますが、ユーザーが入力を追加してもこれは変更されません。
エリックバーカー

37

これは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

5

これにより、のすべての有効な数値が得られますlines。ループを変更して、検証したり、無効な文字を削除したりすることができます。

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

4
一般的な注意として、ほとんどの場合、2番目の引数をparseIntに渡して、基数10/10進数(parseInt(this, 10))として強制的に読み取る必要があります。それ以外の場合、先行ゼロは基数8(8進数)としての解釈につながり、かなり奇妙な動作につながる可能性があります...
IMSoP 2012年

5

2つのオプション: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])
}

サイドノート、forEachを好む場合、サンプルループは

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

4

単純な正規表現は、テキスト領域をチェックするのに効率的です。

/\s*\d+\s*\n/g.test(text) ? "OK" : "KO"
弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.