限制文本区域中的换行符答案

【问题标题】：Limit line breaks in textarea限制文本区域中的换行符
【发布时间】：2022-01-25 19:10:31
【问题描述】：

我有一个文本区域，我想允许用户通过按 Enter 来换行，但我想将其限制为只有一个换行符，因为这样用户可以添加他们想要的多个换行符，从而创建巨大的空白在输出中。

  <textarea maxLength={3000} onChange={(e) => setPersonBio(e.target.value)} value={personBio} type="text" rows="5" className="bio-content" placeholder="Enter something about yourself..."></textarea>

然后我用white-space: pre-line;在<p>标签中显示它

我的问题是如何限制用户可以输入的休息时间，或者在提交后删除额外的休息时间。

【问题讨论】：

标签： javascript html reactjs

【解决方案1】：

您可以在while 循环内使用String methods search 和include 来删除给定重复字符中的一个以外的所有字符。

text = "abc\n\n\ndef\n\nghi"; 
document.write('<textarea rows=6>'+text+'</textarea>');
while (text.includes("\n\n"))
  text = text.replace("\n\n","\n");
document.write('<textarea rows=6>'+text+'</textarea>');

【讨论】：

【解决方案2】：

你可以试试这个：

 <textarea maxLength={3000} onChange=textAreaChange(e) value={personBio} type="text" rows="5" className="bio-content" placeholder="Enter something about yourself..."></textarea>

var pre="";
function textAreaChange(e){
    if(e.target.value.split("\n").length>1){
        e.target.value=pre;
        return;
    };
    setPersonBio(e.target.value);
    pre=e.target.value;
};

将 javascript 添加到您为本网站保存所有其他 javascript 的位置。

【讨论】：