使用jQuery填充textarea时，如何避免空字段产生多余换行

嘿，这个问题其实很好解决！核心思路就是只保留非空的地址字段，再用换行符把它们拼接起来，这样就不会出现多余的空行了。

方案一：逐个判断收集非空字段 #

这种方式逻辑清晰，适合字段不多的场景：

// 先创建一个数组，用来存放非空的地址行
const addressLines = [];

// 逐个判断字段是否非空，是就加入数组
if (address.street) addressLines.push(address.street);
if (address.building_name) addressLines.push(address.building_name);
if (address.Floor) addressLines.push(address.Floor);
if (address.city) addressLines.push(address.city);

// 用换行符拼接数组元素，再赋值给textbox
$('#id_address').val(addressLines.join('\n'));

方案二：用数组过滤简化代码 #

如果地址字段比较多，这种写法更简洁，利用filter()自动过滤掉空字符串、null、undefined这类假值：

// 把所有字段放进数组，再过滤掉空值
const addressLines = [
  address.street,
  address.building_name,
  address.Floor,
  address.city
].filter(line => line);

// 拼接后赋值
$('#id_address').val(addressLines.join('\n'));

为什么原来的写法会有问题？ #

你之前的代码是不管字段是否为空，都直接拼接'\n'，比如当Floor为空时，相当于拼接了address.building_name + '\n' + '' + '\n' + address.city，这就导致building_name和city之间多了一个空行。而上面的两种方案只会把非空字段加入数组，拼接时自然不会产生多余的换行。

内容的提问来源于stack exchange，提问作者Sapna Sharma