代码之家 › 专栏 › 技术社区 › user3806255

从文本区域删除第一行

whitespace regex javascript

user3806255 · 技术社区 · 6 年前

我有一个工具,可以从确认书(文本)中删除空行,但由于某种原因,顶行没有被视为空行,也不会被删除。

目前,我的工具允许用户将文本粘贴到文本区域,然后单击“删除空格和复制”按钮时,删除空行并将文本复制到剪贴板。

我想保留相同的功能,但在文本区域输入文本或单击“删除空格和复制”按钮时,以某种方式删除第一行。

 <script>
 function copyToClipboard(element) {
  var text = $(element).clone().find('br').prepend('\r\n').end().text()
  element = $('<textarea>').appendTo('body').val(text).select()
  document.execCommand('copy')
  element.remove()
  }
  </script>

<textarea name="mas" rows="100" rows="50" contenteditable="true" id="p20" class="content" onchange="this.value=this.value.replace(/[\n\r](?!\w)/gi,'');" style="height: 500px; width:800px;" type="text" data-bind="value: myValue, hasFocus: cleared"></textarea>

<!----------- BUTTONS ------------>
<div class="fixed">
<button onclick="copyToClipboard('#p20')" class="templateBtn">Remove Spaces & Copy</button>
<input type="button" data-bind="click: clearValue" value="clear" class="templateBtn" />
<script type="text/javascript">
    var viewModel = {
   myValue: ko.observable(''),
   cleared: ko.observable(false),
   clearValue: function() {       
   this.myValue('');   
   this.cleared(true);
    }
  };

  ko.applyBindings(viewModel);
   </script>

  <!----------- END.BUTTONS ------------>

 <div class="mas" id="hide" ></div>

 <pre contenteditable="true" id="p20" class="templateText">

 </div></div>

2 回复 | 直到 6 年前

traktor 6 年前

正则表达式 [\n\r](?!\w) 匹配任何不后跟字母数字或下划线字符的CR或LF。因此,当用空字符串替换空行时,它可以匹配一行中两个行终止符中的第一个。 '' 它与后跟字母的行结束符不匹配。因此,文本开头的行终止符,后跟一个单词字符,保留在原位。

定义为“行开始,后跟零个或多个不包括行终止符的空白字符,后跟行结束,后跟零个或多个行终止符”的空行可以由多行正则表达式进行匹配,例如:

/^[ \f\t\v\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]*$[\n\r]*/gm;

其中,第一个字符集是用于匹配空白的字符集( \s )删除换行符和回车符后 $[\n\r]* 组件匹配行终止符和输入端。(已编辑:匹配末尾没有行终止符的尾随空行)

请在下面输入行并单击textarea元素外部以触发更改事件:

function removeBlankLines( textArea) {
   var blankLine = /^[ \f\t\v\u00a0\u1680\u180e\u2000-\u200a\u2028\u2029\u202f\u205f\u3000\ufeff]*$[\n\r]*/gm;
   textArea.value=textArea.value.replace(blankLine,'');
}

<textarea onchange="removeBlankLines( this)" cols="20" rows="8"></textarea>

这不会修剪或删除非空行内的空格。如果您在实现自己的目标方面仍有困难,请使用用于生成问题的文本数据更新问题,并详细描述您的期望和得到的结果。如果与问题无关,请删除淘汰码(似乎不相关)。

Sébastien 6 年前

以下是您可以使用的快速修复,执行 trim() 在替换的文本上:

<textarea name="mas" rows="100" rows="50" contenteditable="true"
id="p20" class="content"
onchange="this.value=(this.value.replace(/[\n\r](?!\w)/gi,'')).trim();"
style="height: 500px; width:800px;" type="text"
data-bind="value: myValue, hasFocus: cleared"></textarea>