Textarea，删除最后一段

Question

我想从 Textarea 中删除最后一段，但我的脚本只能运行一次 - 有没有办法在我每次单击按钮时删除最后一段？

<!DOCTYPE html>
<html>
<body>

<textarea id="V1" rows="17" cols="65">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque tincidunt scelerisque libero. Sed convallis magna eu sem. Pellentesque sapien. 

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. 

Integer imperdiet lectus quis justo. Et harum quidem rerum facilis est et expedita distinctio. Duis viverra diam non justo. 

Aliquam erat volutpat. Aenean placerat. Nullam justo enim, consectetuer nec, ullamcorper ac, vestibulum in, elit. In convallis.</textarea>

<button onclick="remove()">Remove</button>

<script>
function remove() {
var elem = document.getElementById('V1'),
val = elem.value.split(/(?:\r\n|\r|\n)/g);
val.pop();
elem.value = val.join('\r\n') + ('\r\n');
}
</script>

</body>
</html>

Answer 1

<!DOCTYPE html>
<html>
<body>
    
    <textarea id="V1" rows="17" cols="65">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque tincidunt scelerisque libero. Sed convallis magna eu sem. Pellentesque sapien.
Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo.
Integer imperdiet lectus quis justo. Et harum quidem rerum facilis est et expedita distinctio. Duis viverra diam non justo. 
Aliquam erat volutpat. Aenean placerat. Nullam justo enim, consectetuer nec, ullamcorper ac, vestibulum in, elit. In convallis.</textarea>
    
    <button onclick="remove()">Remove</button>
    
    <script>
        function remove() {
            var elem = document.getElementById('V1'),
        val = elem.value.split("\n");
            val.pop();
            elem.value = val.join("\n");
        }
    
    </script>
    
</body>
</html>

Answer 2

这可以使用 filter() 方法来完成。删除后，行间距保留。

function remove() {
  var elem = document.getElementById('V1'),
  val = elem.value.split(/(?:\r\n|\r|\n)/g).filter(function(i){
  return i;
  });
  val.pop();
  elem.value = val.join('\n\r');
}

<textarea id="V1" rows="17" cols="65">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque tincidunt scelerisque libero. Sed convallis magna eu sem. Pellentesque sapien. 

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. 

Integer imperdiet lectus quis justo. Et harum quidem rerum facilis est et expedita distinctio. Duis viverra diam non justo. 

Aliquam erat volutpat. Aenean placerat. Nullam justo enim, consectetuer nec, ullamcorper ac, vestibulum in, elit. In convallis.</textarea>

<button onclick="remove()">Remove</button>

Answer 3

你必须 filter 空字符串，因为 pop 去掉数组的最后一项，但有时你的最后一项是这样的：""

为此，我使用了 double bang 或 !!，其中 returns 是一个基于值的布尔值。

有关双刘海的更多信息：https://medium.com/better-programming/javascript-bang-bang-i-shot-you-down-use-of-double-bangs-in-javascript-7c9d94446054

因此，我在 join 中添加了 +1 \r\n 以保留空行。

function remove() {
  var elem = document.getElementById('V1');
  var val = elem.value.split(/(?:\r\n|\r|\n)/g).filter(paragraph => !!paragraph);

  val.pop();

  elem.value = val.join('\r\n\r\n');
}

Answer 4

您正在最后添加一个 \r\n 序列。随后的调用只会删除该部分。如果你省略这个，而不是 trim 文本，它应该工作：

<!DOCTYPE html>
<html>
<body>

<textarea id="V1" rows="17" cols="65">Lorem ipsum dolor sit amet, consectetuer adipiscing elit. Quisque tincidunt scelerisque libero. Sed convallis magna eu sem. Pellentesque sapien. 

Sed ut perspiciatis unde omnis iste natus error sit voluptatem accusantium doloremque laudantium, totam rem aperiam, eaque ipsa quae ab illo inventore veritatis et quasi architecto beatae vitae dicta sunt explicabo. 

Integer imperdiet lectus quis justo. Et harum quidem rerum facilis est et expedita distinctio. Duis viverra diam non justo. 

Aliquam erat volutpat. Aenean placerat. Nullam justo enim, consectetuer nec, ullamcorper ac, vestibulum in, elit. In convallis.</textarea>

<button onclick="remove()">Remove</button>

<script>
function remove() {
  var elem = document.getElementById('V1'),
  val = elem.value.split(/(?:\r\n|\r|\n)/g);
  val.pop();
  elem.value = val.join('\r\n').trim();
}
</script>

</body>
</html>

Textarea，删除最后一段

Textarea, remove last paragraph

javascript

split

textarea

join