如何逐行读取文本区域的HTML标记

How to read line by line of a text area HTML tag

本文关键字：区域 取文本 HTML 标记 读取 何逐行 逐行      更新时间：2023-09-26

我有一个文本区域，每行都包含整数值，如下所示

      1234
      4321
     123445

我想检查用户是否真的渗透了有效的值，而不是一些有趣的值，比如下面的

      1234,
      987l;

为此，我需要逐行阅读文本区域并验证它。如何使用javascript逐行读取文本区域？

试试这个。

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>
相关文章：