hugh 的个人博客

contenteditable属性将普通元素变为编辑框

属性:contenteditable

作用:将普通元素变为编辑框

范例:<div class="chatinput" contenteditable ></div>

属性值:

描述
true 规定可以编辑元素内容。
false 规定无法编辑元素内容。
classname 继承父元素的 contenteditable 属性。

浏览器支持性:

 IEFirefoxChromeSafariOperaiOS SafariOpera MiniOpera MobileAndroid Browser
14 versions back     4.0: Supported            
13 versions back     5.0: Supported            
12 versions back   2.0: Not supported 6.0: Supported            
11 versions back   3.0: Partial support 7.0: Supported            
10 versions back   3.5: Supported 8.0: Supported            
9 versions back   3.6: Supported 9.0: Supported            
8 versions back   4.0: Supported 10.0: Supported   9.0: Supported        
7 versions back   5.0: Supported 11.0: Supported   9.5-9.6: Supported        
6 versions back   6.0: Supported 12.0: Supported   10.0-10.1: Supported        
5 versions back   7.0: Supported 13.0: Supported   10.5: Supported        
4 versions back 5.5: Supported 8.0: Supported 14.0: Supported 3.1: Supported 10.6: Supported     10.0: Not supported  
3 versions back 6.0: Supported 9.0: Supported 15.0: Supported 3.2: Supported 11.0: Supported 3.2: Not supported   11.0: Not supported 2.1: Not supported
2 versions back 7.0: Supported 10.0: Supported 16.0: Supported 4.0: Supported 11.1: Supported 4.0-4.1: Not supported   11.1: Not supported 2.2: Not supported
Previous version 8.0: Supported 11.0: Supported 17.0: Supported 5.0: Supported 11.5: Supported 4.2-4.3: Not supported   11.5: Not supported 2.3: Not supported 3.0: Supported
Current 9.0: Supported 12.0: Supported 18.0: Supported 5.1: Supported 11.6: Supported 5.0: Supported 5.0-6.0: Not supported 12.0: Not supported 4.0: Supported
Near future 10.0: Supported 13.0: Supported 19.0: Supported 5.2: Supported 12.0: Supported        
Farther future   14.0: Supported 20.0: Supported            

 

如何使contenteditable元素 支持placeholder,使用css

 [contenteditable=true]:empty:before{
        content: attr(placeholder);
        display: block; /* For Firefox */
      }

 

 


标题:contenteditable属性将普通元素变为编辑框
作者:hugh0524
地址:https://blog.uproject.cn/articles/2016/04/12/1460471105220.html