[英]html / javascript - Turn input text into textarea when space runs out
So I have a text input. 所以我有一个文本输入。
<input type="text" id="myText" style="width: 400px; height: 20px;">
I want to turn it into a textarea when there is no longer enough space to type stuff in. 当空间不足以输入内容时,我想将其转换为文本区域。
Once the text input has run out of space, I want to change it to something like this: 一旦文本输入空间不足,我想将其更改为以下内容:
<textarea id="myText" style="width: 400px; height: 40px; resize: none;"></textarea>
And when the space in the textarea has run out, its height will be changed again: 当文本区域中的空间用完时,其高度将再次更改:
<textarea id="myText" style="width: 400px; height: 60px; resize: none;"></textarea>
The main problem that I am facing is turning the original input text into a textarea. 我面临的主要问题是将原始输入文本转换为文本区域。 Is there an easy way besides trial and error to really detect if the space has run out? 除了反复试验之外,还有一种简便的方法可以真正检测出空间是否用完了? And how do I change my text input into a textarea once the space has run out? 一旦空间用完,如何将文本输入更改为文本区域?
Thanks. 谢谢。
I think having two different elements complicates things, have a look at only having a textarea element and then expand it as needed. 我认为拥有两个不同的元素会使事情变得复杂,只考虑拥有一个textarea元素,然后根据需要对其进行扩展。 There's a jQuery plugin you might want to look into if you're ok with using jQuery: http://www.jacklmoore.com/autosize/ 如果您可以使用jQuery,可以尝试使用一个jQuery插件: http : //www.jacklmoore.com/autosize/
声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.