javascript - 让 html 文本输入字段随着我的输入而增长？

Question

我可以在 css 中设置初始文本输入大小，如下所示:

width: 50px;

但我希望它在我输入时增长，直到达到例如 200 像素。 这可以直接用 css、html 来完成，最好不用 javascript 吗？

当然也请发布您的 js/jquery 解决方案，但如果没有它们也可行 - 那就太好了。

我在这里尝试:

http://jsfiddle.net/jszjz/2/

Answer 1

这是一个只有 CSS 和 Content Editable 的例子:

jsFiddle Example

CSS

span 
{
    border: solid 1px black;
}
div 
{
    max-width: 200px;   
}

HTML

<div>
    <span contenteditable="true">sdfsd</span>
</div>

---

关于contenteditable的重要说明

使 HTML 元素 contenteditable 允许用户将复制的 HTML 元素粘贴到该元素中。这可能不适合您的用例，因此在选择使用它时请记住这一点。