不输入时隐藏输入文本字段

Question

当我在输入表单内输入时，文本只会在消失之前暂时显示，我唯一可以防止这种情况的方法是将手指放在键盘上。

当我创建一个resizeInput属性时，这个问题才开始出现，该属性使得输入框根据其内部的值发生变化，例如：输入框随着我输入的每个字母变大。

无论如何我可以防止这种情况发生吗？

* jsfiddle中的jquery出现了问题，resizeInput由于某些原因而无法正常工作，而且＃34;文本只会在消失之前暂时显示＆＃34; ＃34;影响。但是，如果您在文本框外单击

，问题仍然存在

JS小提琴：http://jsfiddle.net/bx15jdw0/

HTML

<input id="message" type="text" placeholder="It's your turn to type....!" required="required">

Answer 1

从css中移除line-height并将jQuery包含在你的小提琴中，它会起作用。

DEMO

Answer 2

从css中移除行高，它将起作用

更新小提琴：http://jsfiddle.net/bx15jdw0/3/

你的新CSS：

input 
{
    display: block;
    margin: 20px;
    width: auto;
    height: 60px;
    font-size: 50px;
    color: #000000;
    outline:none;
 }

行高对于输入来说太大了，这就是为什么它这样做。尝试将其缩小并且可以正常工作

Answer 3

删除行高或缩小

http://jsfiddle.net/bx15jdw0/7/

input 
{
display: block;
margin: 20px;
width: auto;
height: 60px;
font-size: 50px;
color: #000000;
outline:none;
}