So lesen Sie zeilenweise ein HTML-Tag für einen Textbereich

87

Ich habe einen Textbereich, in dem jede Zeile einen ganzzahligen Wert wie folgt enthält

      1234
      4321
     123445

Ich möchte überprüfen, ob der Benutzer wirklich gültige Werte eingegeben hat und nicht einige lustige Werte wie die folgenden

      1234,
      987l;

Dafür muss ich Zeile für Zeile des Textbereichs lesen und das validieren. Wie kann ich mit Javascript Zeile für Zeile einen Textbereich lesen?

javascript jquery html textarea Saurabh Kumar
quelle
2
Ich bin nicht 100% sicher (daher der Kommentar), aber es kann sein, dass der Text bei jedem "\ n" aufgeteilt wird
Pluckerpluck
1
Mögliches Duplikat des Analysierens eines Textbereichs in Teilzeichenfolgen basierend auf Zeilenumbrüchen in Javascript
Michael Berkowski

Antworten:

176

Versuche dies.

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
}
ShankarSangoli
quelle
14
Anstatt zu verwenden $('textarea').val(), document.getElementById('textareaId').innerHTMList es das.
ShankarSangoli
3
Ich erinnere mich, dass wir eine andere Methode angewendet haben. Wir haben form.elementname oder so benutzt. Ich meine vor langer Zeit. Vor 6-7 Jahren, als DOM ziemlich neu war
SoWhat
Ja, Sie können sogar mit document.formname.textareName.value
ShankarSangoli
3
Werden Zeilen garantiert mit \ n und nicht mit \ r \ n enden?
Oztaco - Wiedereinsetzung von Monica C.
Für diejenigen, die 2020 hier sind, kann ich nicht sicher sagen, wie sich der Browser verhalten hat, als die obigen Kommentare hinzugefügt wurden, aber derzeit erkennt Chrome document.getElementById ('textarea') nicht. InnerHTML, es sei denn, es ist bereits als Platzhaltertext geladen in der ursprünglichen Last des DOM. Sie müssten den Wert document.getElementById ('textarea'). Verwenden, um auf Text zuzugreifen, den der Benutzer eingegeben oder geändert hat. Beim Laden der Seite wird Platzhaltertext als innerer HTML-Code zwischen die Tags <textarea> </ textarea> eingefügt. Dies wird jedoch nicht geändert, wenn ein Benutzer Eingaben hinzufügt.
Eric Barker
36

Dies funktioniert ohne 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
Paul Brewczynski
quelle
5

Dies würde Ihnen alle gültigen numerischen Werte in geben lines. Sie können die Schleife ändern, um ungültige Zeichen zu validieren, zu entfernen usw. - je nachdem, was Sie möchten.

var lines = [];
$('#my_textarea_selector').val().split("\n").each(function ()
{
    if (parseInt($(this) != 'NaN')
        lines[] = parseInt($(this));
}
Joe
quelle
4
Generell möchten Sie fast immer das zweite Argument an parseInt übergeben, um das Lesen als Basis 10 / decimal ( parseInt(this, 10)) zu erzwingen . Andernfalls führen führende Nullen zur Interpretation als Basis 8 (oktal), was zu einem merkwürdigen Verhalten führen kann ...
IMSoP
5

Zwei Optionen: keine JQuery erforderlich oder JQuery-Version

Keine JQuery (oder irgendetwas anderes erforderlich)

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

Randnotiz, wenn Sie für jede eine Beispielschleife bevorzugen

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

Eine einfache Regex sollte wirksam sein, um Ihren Textbereich zu überprüfen:

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