处理多行文本框textarea内容为string,换行兼容ios和andriod

需要效果:帮忙将textarea中的输入文本处理成字符串(同时其中处理换行的正则兼容ios和andriod):
1. 如果手动换行将换行符处理成 |, 每行的左右空格需要清除,中间空格要做兼容多端的操作并且保留下来
2. 每行输入不可超过35个字符,最多140个字符,不包括换行符

可以使用正则表达式来处理输入文本和换行符。下面是一个可能的实现方式,具体代码可以根据需求进行修改和优化:

// 获取textarea输入文本
const textArea = document.querySelector('#myTextarea');
const inputText = textArea.value;

// 将换行符处理成指定分隔符
const processedText = inputText.replace(/(\r\n|\r|\n)/gm, '|');

// 将每行左右空格清除并保留中间空格
const trimmedText = processedText.replace(/^\s+|\s+$/g, '').replace(/\s+/g, ' ');

// 将输入按照35个字符一行切分,并保留原有的换行符
const lines = trimmedText.match(/.{1,35}[\r\n]+?/g);

// 将切分后的输入字符串拼接为一个字符串
let finalText = '';
if (lines !== null) {
  lines.forEach((line) => {
    // 如果一行的长度超过35个字符,则截取前35个字符
    if (line.length > 35) {
      line = line.substring(0, 35);
    }
    finalText += line.trim() + '\n'; // 添加换行符
  });
}

// 输出最终处理后的字符串
console.log(finalText);

需要注意的是,由于不同平台的换行符可能不同,因此需要使用兼容多端的正则表达式来处理换行符。在上面的代码中,我们使用了 /(\r\n|\r|\n)/gm 正则表达式来匹配并替换换行符。其中,m 标志表示多行匹配,g 标志表示全局匹配,\r\n 表示 Windows 平台的换行符,\r 表示 Mac 平台的换行符,\n 表示 Unix/Linux 平台的换行符。


反转为页面展示:将包含空格或|的字符串处理成页面显示内容:
1. |需要换成换行符(需要兼容多端,支持多端均换行)
2. 中间空格需要处理成可识别的空格,兼容多端,不能出现部分机型多个空格只保留一个的问题

可以使用以下代码实现:

def format_string(input_str):
    # 将|替换为换行符
    input_str = input_str.replace('|', '\n')
    # 将中间空格替换为全角空格
    input_str = input_str.replace(' ', '\u3000')
    return input_str

这里使用了 Python 中的字符串替换函数 replace(),将 | 替换为换行符 \n,将空格替换为全角空格 \u3000

需要注意的是,在多端显示时,全角空格并不是所有端都能正常显示,因此可以根据具体需求选择使用其他可识别的空格,比如 \t(制表符)。


要兼容多种端兼容的空格处理方法,可以使用正则表达式和特殊字符。以下是一个示例代码,可以将字符串中的空格处理成支持多种端不兼容的格式:

function processSpace(str) {
  // 将多个空格合并成一个空格
  //str = str.replace(/\s+/g, ' ');

  // 将空格替换成特殊字符(下面这些特殊字符在多种端上都能正常显示)
  str = str.replace(/\s/g, '\u00A0');

  return str;
}

在上述代码中,我们首先使用正则表达式将多个连续的空格合并成一个空格。接着,我们将每个空格替换成 \u00A0 这个特殊字符。这个特殊字符在多种端上都能正常显示,所以可以达到兼容多种端的效果。

要使用上述函数,只需要将需要处理的字符串作为参数传入即可。例如:

const str = 'hello    world';
const processedStr = processSpace(str);
console.log(processedStr);

在上述代码中,我们将字符串 'hello   world' 作为参数传入了 processSpace 函数中,并将得到的处理结果打印到了控制台上。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

绝世唐门三哥

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值