微信小程序中的<textarea>还是无法实现
时间: 2024-03-20 19:44:03 浏览: 144
微信小程序 textarea 组件详解及简单实例
非常抱歉,如果在微信小程序中使用了我的方法,但仍然无法实现换行,可能是因为微信小程序对于 `textarea` 的样式支持性不够好而导致的。在这种情况下,你可以尝试使用一个 hack 来实现换行。
具体来说,你可以在 `textarea` 的 `placeholder` 属性中使用 `\n` 或者 ` ` 来实现换行,然后通过一个伪元素来将 `\n` 或者 ` ` 替换成 `<br>` 标签。具体的 CSS 代码如下:
```
textarea::-webkit-input-placeholder {
white-space: pre-wrap;
}
textarea::-moz-placeholder {
white-space: pre-wrap;
}
textarea:-ms-input-placeholder {
white-space: pre-wrap;
}
textarea::placeholder {
white-space: pre-wrap;
}
textarea.placeholder::before {
content: attr(placeholder);
display: block;
white-space: pre-wrap;
visibility: hidden;
}
```
你可以将这些样式保存在外部 CSS 文件中,并将其链接到小程序页面中。
然后,在 `textarea` 元素中添加一个 `class`,例如 `placeholder`:
```
<textarea class="placeholder" placeholder="第一行\n第二行"></textarea>
```
这样,就可以实现在 `textarea` 的 `placeholder` 中的文字换行了。
阅读全文