Comment lire ligne par ligne d'une balise HTML de zone de texte

92

J'ai une zone de texte où chaque ligne contient une valeur entière comme suit

      1234
      4321
     123445

Je veux vérifier si l'utilisateur a vraiment saisi des valeurs valides et non des valeurs amusantes comme suit

      1234,
      987l;

Pour cela, j'ai besoin de lire ligne par ligne de zone de texte et de valider cela. Comment lire ligne par ligne d'une zone de texte en utilisant javascript?

javascript jquery html textarea Saurabh Kumar
la source
2
Je ne suis pas sûr à 100% (d'où le commentaire) mais cela peut impliquer de diviser le texte à chaque "\ n"
Pluckerpluck
1
duplication possible de l' analyse d'une zone de texte dans des sous-chaînes en fonction des sauts de ligne en Javascript
Michael Berkowski

Réponses:

181

Essaye ça.

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
la source
14
Au lieu d'utiliser, $('textarea').val()utilisez document.getElementById('textareaId').innerHTMLc'est tout.
ShankarSangoli
3
je me souviens qu'il y avait une autre méthode que nous avons utilisée. Nous avons utilisé form.elementname ou quelque chose comme ça. Je veux dire il y a longtemps. Il y a 6-7 ans quand DOM était assez nouveau
SoWhat
Oui, vous pouvez même y accéder en utilisant document.formname.textareName.value
ShankarSangoli
3
Les lignes se terminent-elles par \ n et non par \ r \ n?
Oztaco - Réintégrer Monica C.
Pour ceux qui sont ici en 2020, je ne peux pas dire avec certitude quel était le comportement du navigateur lorsque les commentaires ci-dessus ont été ajoutés, mais actuellement Chrome ne reconnaît pas document.getElementById ('textarea'). InnerHTML À MOINS qu'il ne soit déjà chargé comme texte d'espace réservé dans la charge d'origine du DOM. Vous devrez utiliser document.getElementById ('textarea'). Value pour accéder à tout texte que l'utilisateur a entré ou modifié. Lors du chargement de la page, le texte d'espace réservé est placé en tant que HTML interne entre les balises <textarea> </textarea>, mais cela n'est pas modifié lorsqu'un utilisateur ajoute une entrée.
Eric Barker
37

Cela fonctionne sans avoir besoin de 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
la source
5

Cela vous donnerait toutes les valeurs numériques valides dans lines. Vous pouvez modifier la boucle pour valider, supprimer les caractères non valides, etc., comme vous le souhaitez.

var lines = [];
$('#my_textarea_selector').val().split("\n").each(function ()
{
    if (parseInt($(this) != 'NaN')
        lines[] = parseInt($(this));
}
Joe
la source
4
En règle générale, vous voulez presque toujours passer le deuxième argument à parseInt pour forcer la lecture en base 10 / decimal ( parseInt(this, 10)). Sinon, les zéros non significatifs conduisent à une interprétation en base 8 (octal), ce qui peut conduire à un comportement assez étrange ...
IMSoP
5

Deux options: pas de JQuery requis ou version JQuery

Pas de JQuery (ou quoi que ce soit d'autre requis)

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

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

Note latérale, si vous préférez pourChaque boucle d'échantillonnage est

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

Une simple regex devrait être efficace pour vérifier votre zone de texte:

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