Jak czytać wiersz po wierszu znacznika HTML obszaru tekstowego


92

Mam obszar tekstowy, w którym każda linia zawiera wartość całkowitą, jak poniżej

      1234
      4321
     123445

Chcę sprawdzić, czy użytkownik naprawdę wprowadził prawidłowe wartości, a nie jakieś zabawne wartości, takie jak poniżej

      1234,
      987l;

W tym celu muszę przeczytać wiersz po wierszu obszaru tekstowego i potwierdzić to. Jak czytać wiersz po wierszu w obszarze tekstowym za pomocą JavaScript?


2
Nie jestem pewien w 100% (stąd komentarz), ale może to oznaczać dzielenie tekstu co „\ n”
Pluckerpluck,

1
możliwy duplikat parsowania
Michael Berkowski

Odpowiedzi:


181

Spróbuj tego.

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
Zamiast używać $('textarea').val()użyj document.getElementById('textareaId').innerHTMLtego.
ShankarSangoli

3
pamiętam, że była inna metoda, której użyliśmy. Użyliśmy form.elementname czy czegoś podobnego. Mam na myśli dawno temu. 6-7 lat temu, kiedy DOM był całkiem nowy
SoWhat

Tak, możesz nawet uzyskać do niego dostęp za pomocą document.formname.textareName.value
ShankarSangoli,

3
Czy linie kończą się na \ n, a nie na \ r \ n?
Oztaco - Przywróć Monikę C.

Dla tych, którzy są tutaj w 2020 roku, nie mogę z całą pewnością powiedzieć, jakie było zachowanie przeglądarki po dodaniu powyższych komentarzy, ale obecnie Chrome nie rozpoznaje document.getElementById ('textarea'). InnerHTML, JEŚLI nie jest już załadowana jako tekst zastępczy w oryginalnym ładowaniu DOM. Aby uzyskać dostęp do dowolnego tekstu wprowadzonego lub zmodyfikowanego przez użytkownika, należy użyć wartości document.getElementById („textarea”). Podczas ładowania strony tekst zastępczy jest umieszczany jako wewnętrzny kod HTML między tagami <textarea> </textarea>, ale nie jest to modyfikowane, gdy użytkownik dodaje dane wejściowe.
Eric Barker

37

Działa to bez potrzeby 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

Dałoby to wszystkie prawidłowe wartości liczbowe w lines. Możesz zmienić pętlę, aby sprawdzić poprawność, usunąć nieprawidłowe znaki itp. - cokolwiek chcesz.

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

4
Ogólnie rzecz biorąc, prawie zawsze chcesz przekazać drugi argument do parseInt, aby wymusić czytanie jako podstawa 10 / decimal ( parseInt(this, 10)). W przeciwnym razie wiodące zera prowadzą do interpretacji jako podstawa 8 (ósemkowa), co może prowadzić do dość dziwnego zachowania ...
IMSoP

5

Dwie opcje: nie jest wymagana wersja JQuery lub wersja JQuery

Brak JQuery (lub cokolwiek innego jest wymagane)

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

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

Uwaga dodatkowa, jeśli wolisz forEach pętla sampli jest

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

4

Proste wyrażenie regularne powinno być skuteczne, aby sprawdzić obszar tekstu:

/\s*\d+\s*\n/g.test(text) ? "OK" : "KO"
Korzystając z naszej strony potwierdzasz, że przeczytałeś(-aś) i rozumiesz nasze zasady używania plików cookie i zasady ochrony prywatności.
Licensed under cc by-sa 3.0 with attribution required.