【问题标题】:how to truncate multiple lines in textarea?如何截断textarea中的多行?
【发布时间】:2019-05-16 20:44:32
【问题描述】:

我正在尝试创建一个 2 文本区域工具,我在其中将多达 300 行文本输入到 1 个文本区域中,它会删除除前 5 个字符之外的所有字符,并且仅在第二个文本区域中吐出这 5 个字符

请原谅我失败的尝试我知道我的代码到处都是我尝试了多种方法来做到这一点我相信 forloop 会是最好的但我无法让 .substring 工作

function lineParse() {
var parseBoxList = document.getElementById("parsebox").value;
var nodeLength = 5;
var trimFat = parseBoxList.substring(0, nodeLength);
var text = document.getElementById("parsebox").value;   
var lines = text.split('/n');
var cut = lines.substring(0, 5);
var count = lines.length;      
var x = document.getElementById("parsebox").value;

var text2 = "";
  var i;
var parseLength = 5;

  for (i = 0; i < lines.length; i++) {
    var text3 = text2;
text2 += lines[i];
}



  document.getElementById("demo").innerHTML = cut;

什么都没发生

【问题讨论】:

  • 您没有使用正确的分隔符。换行符是 \n 而不是 /n。
  • 你试过使用text-overflow: ellipsis风格吗?
  • 子字符串也必须用在字符串上,顾名思义,所以在数组上使用它是行不通的。
  • 我是否遗漏了什么,或者这是您想要实现的目标? jsfiddle.net/eojxmpga/3
  • @JakoBasson 接近我想要做的事情,但我希望它创建一个数组并切片数组并拆分每一行,所以假设我有 1 个文本区域,其中包含 10 行文本,即 40字符长我需要在第二个文本区域中吐出所有 40 行的前 5 个字符

标签: javascript substring textarea


【解决方案1】:

您应该能够使用以下代码实现您正在寻找的内容:

HTML

<textarea id="textarea1">
this1 is a line 
this2 is a line 
this3 is a line 
this4 is a line 
this5 is a line 
</textarea>
<textarea id="textarea2"></textarea>

<button id="execute">Execute</button>

JS

function test() {
  // split text area value by newline
  var lines = document.getElementById("textarea1").value.split("\n");

  var newText = "";

  // loop over text area line array and substring each to get the first 5 characters
  for (var i = 0; i < lines.length; i++) {
    var line = lines[i];
    newText += line.substring(0, 5) + "\n";
  }

  // set values to newText variable
  document.getElementById("textarea2").value = newText;
  document.getElementById("textarea1").value = newText;
}

document.getElementById("execute").addEventListener('click', test);

https://jsfiddle.net/zdu6kcvx/3/

【讨论】:

    猜你喜欢
    • 2011-10-30
    • 1970-01-01
    • 2022-01-11
    • 2014-03-04
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    相关资源
    最近更新 更多