1,input框設置了readonly屬性
<input type="text" name="name" value="123" readonly="readonly" />
readonly 屬性規定輸入字段爲只讀,不可以修改但是可以複製。
2,input框自身設置font-size爲0
<input type="text" style="font-size: 0px;width: 100px;height:30px;" />
這種情況比較少見,但是有些時候,爲了消除span元素之間的間隔會讓font-size爲0,此時input框應該是內容區爲0*0個像素,如果強行設置input寬高,這時就算input框顯示了,因爲font-size爲零,就啥也輸不進去。
3,input框被其他元素擋住
<div style="width: 200px;height: 200px;float: left;position: absolute;z-index: 100;">
</div>
<input type="text" style="position: absolute;z-index: 10;" />
這種情況大致是因爲浮動和z-index引起的,它的特點是即使點擊input元素也不會出現選中狀態,只要認真排查一下html的結構合不合理,就可以找到問題。
4,設置了用戶不可選中文本,usr-select:none;
*{margin:0;padding:0;user-select: none;-ms-user-select: none;-moz-user-select: none;-webkit-user-select: none;}
可能會因爲瀏覽器的一些適配問題,導致你設置的user-select:none;影響到了input框的正常事件
5,return false;的使用清除了input框的默認事件
我們知道使用stopPropagation(); 可以阻止默認的冒泡事件,使用preventDefault();可以消除默認事件,但是在使用中貪圖方便直接用return false;來代替以上兩種方法,阻止默認事件用reutrn false,但是在jquery中,reutrn false;既阻止了冒泡,又消除了默認事件,如果不清楚這一點很有可能在使用on綁定事件時,使用reutrn false;消除冒泡的時候也消除了默認事件,導致input框無法輸入內容。