ios中input:disabled文本不显示
之前在联调时遇到了ios系统中input框禁用时,文本内容不显示的问题。在查询相关资料后发现ios系统默认disabled属性时透明度为0.3,这就导致了在视觉效果上文本不显示,解决方法如下:1、设置透明度和填充色input:disabled,input[disabled]{-webkit-opacity:1;opacity: 1;color:#ccc;webkit-text-fill-color
·
之前在联调时遇到了ios系统中input框禁用时,文本内容不显示的问题。在查询相关资料后发现ios系统默认disabled属性时透明度为0.3,这就导致了在视觉效果上文本不显示,解决方法如下:
1、设置透明度和填充色
input:disabled,input[disabled]{
-webkit-opacity:1;
opacity: 1;
color:#ccc;
webkit-text-fill-color:#ccc;
}
2、不用disabled,用readonly属性
该属性在使用时会出现bug,不能编辑但是会出现光标,解决该问题有以下几个方法:
(1)使用js使其在聚焦事件中失焦
<input type="text" value="test" onfocus="this.blur()" readonly="readonly">
(2)使用css(只读表单元素的所有事件无法生效)
[readonly="readonly"] {
pointer-events: none;
}
disabled和readonly都是禁用,不同之处在表单提交的时候,使用disabled的数据无法提交,而使用readonly属性的数据可以提交。
更多推荐
已为社区贡献1条内容
所有评论(0)