巧用expression区分只读文本框和普通文本框的背景色

2022-07-15 80酷酷网 80kuku.com

　　express|文本框

　　对于文本框,只读状态下和普通状态下,浏览器对其并没有做什么特殊的标记,表面看来,效果是一样的,这样,对用户来说,易用性并不是很高.

　　当然,我们可以改变只读文本框的背景颜色来加以区分,这个时候就需要程序员自己判断这个文本框是不是只读,然后再引入相应的css,无疑加大了工作量.

　　这里,使用expression来提供一种解决方案,只需要每个页面引入这个css即可,其它的都由程序自己判断,如下:

<style>input{background-color:expression((this.readOnly && this.readOnly==true)?"#cccccc":"")}</style><INPUT TYPE="text" NAME=""><INPUT TYPE="text" NAME="" readonly><INPUT TYPE="text" NAME=""><INPUT TYPE="text" NAME="" readonly>

[Ctrl+A 全部选择提示：你可先修改部分代码，再按运行]

分享到

微信分享
新浪微博
QQ好友
QQ空间

上一篇关于使用CSS居中(包括水平/垂直)

下一篇详解CSS的定位语法应用