向 <textarea> 添加伪元素答案

【问题标题】：Adding psuedo elements to <textarea>向 <textarea> 添加伪元素
【发布时间】：2015-03-15 12:00:25
【问题描述】：

我最近偶然发现了this article，我决定尝试一下。

我创建了一个小型联系表单，所有<input type="text"> 标签都按原样显示，但<textarea> 出现问题。

我想要的是 textarea 比输入框大，我通过添加来工作

.yoko-textarea::before{
    height:23em;
}}

问题在于，当您在其中输入内容并单击其他位置时，该框会消失。我希望它保持可见，就像 input type="text"> 标签一样。

由于我只添加了相关代码，因此格式被破坏了。您可以在底部找到<textarea>。

如果有人能帮我解决这个问题，我将不胜感激。

【问题讨论】：

【解决方案1】：

问题出在您的document.querySelectorAll 中，您只选择了intput 类型和input__field 类的所有元素。您还必须在其中输入textarea。

替换这个：

[].slice.call( document.querySelectorAll( 'input.input__field' ) ).forEach( function( inputEl )

与：

[].slice.call( document.querySelectorAll( 'input.input__field,textarea.input__field' ) ).forEach( function( inputEl )

【讨论】：