wxml文件内容
<form bindsubmit='commentSubmit'>
<view class='text_box'>
<textarea fixed='true' contenteditable="true" contenteditable="true" auto-height="true" class='weui-textarea' name='commentValue' placeholder='评论' placeholder-style='font-size:30rpx;' maxlength='50' style='background-color: white'></textarea>
</view>
<button form-type='submit' class='textarea_btn'>发送</button>
</form>
fixed='true' 如果 textarea 是在一个 position:fixed 的区域,需要显示指定属性 fixed 为 true
contenteditable="true" 是否自动增高,设置auto-height时,style.height不生效
placeholder-style 指定 placeholder 的样式
placeholder 输入框为空时占位符
wxss文件内容
/* pages/textareaAutoheight/textareaAutoheight.wxss */
.text_box {
background-color: white;
width: 544rpx;
border-radius: 10rpx;
border: 1px solid #e9e9e9;
padding-left: 28rpx;
font-size: 30rpx;
padding-top: 8rpx;
}
.text_box .weui-textarea {
width: 528rpx;
padding-left: 32rpx;
padding: 6rpx 0;
border-radius: 12rpx;
}
.textarea_btn {
width: 96rpx;
height: 60rpx;
font-size: 30rpx;
padding: 0;
line-height: 60rpx;
background-color: #f7ab21;
color: white;
}
网友评论