textarea高度自增长丨技术开发分享录

textarea高度自增长

{{ detail.nickname }}

转载 翻译 {{ formatTime(detail.create_time) }} 字数 {{ detail.content && detail.content.length }} 阅读 {{ detail.read_num }} {{ formatTag(v) }}

"<style type=\"text/css\">\n.grow-wrap {\n    display: grid;\n}\n.grow-wrap::after {\n    content: attr(data-replicated-value) \" \";\n    white-space: pre-wrap;\n    visibility: hidden;\n}\n.grow-wrap>textarea {\n    resize: none;\n    overflow: hidden;\n}\n.grow-wrap>textarea,\n.grow-wrap::after {\n    border: 1px solid #aaa;\n    border-radius: 3px;\n    padding: 10px;\n    grid-area: 1 / 1 / 2 / 2;\n}\n</style>\n\n<div class=\"grow-wrap zh-mt-15\">\n    <textarea name=\"text\" id=\"text\" onInput=\"this.parentNode.dataset.replicatedValue = this.value\"></textarea>\n</div>\n\n```html\n<style type=\"text/css\">\n.grow-wrap {\n    display: grid;\n}\n.grow-wrap::after {\n    content: attr(data-replicated-value) \" \";\n    white-space: pre-wrap;\n    visibility: hidden;\n}\n.grow-wrap>textarea {\n    resize: none;\n    overflow: hidden;\n}\n.grow-wrap>textarea,\n.grow-wrap::after {\n    border: 1px solid black;\n    padding: 10px;\n    grid-area: 1 / 1 / 2 / 2;\n}\n</style>\n\n<div class=\"grow-wrap\">\n    <textarea name=\"text\" id=\"text\" onInput=\"this.parentNode.dataset.replicatedValue = this.value\"></textarea>\n</div>\n```"
PS:写作不易,如要转裁,请标明转载出处。

如果此篇对您有帮助,可小额赞助,以兹鼓励!

猜你想看