当前位置: 首页 > 图文教程 > 网页制作 > HTML/XHTML教程 > 区分只读文本框和普通文本框的背景色

HTML/XHTML教程
关于网页源代码屏蔽(2)
关于网页源代码屏蔽(3)
HTML组件之:HTML行为和HTC行为
HTML组件之:定义标记和命名空间
HTML组件之:最顶级页面(1)
HTML组件之:最顶级页面(2)
HTML组件之:最顶级页面(3)
HTML组件之:编写日历(1)
HTML组件之:编写日历(2)
HTML组件之:编写日历(3)
HTML组件之:ANYDAY 和 TODAY HTC(1)
HTML组件之:ANYDAY 和 TODAY HTC(2)
HTML组件之:日历主页面
HTML组件之:CALENDAR HTC
CSS代码缩写技巧
CSS的十八般技巧(1)
CSS的十八般技巧(2)
HTML中小meta的大作用
CSS类及id的规范化命名
创建一个纯CSS的水平导航条

HTML/XHTML教程 中的 区分只读文本框和普通文本框的背景色


出处:互联网   整理: 软晨网(RuanChen.com)   发布: 2009-11-04   浏览: 46 ::
收藏到网摘: n/a

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

        当然,我们可以改变只读文本框的背景颜色来加以区分,这个时候就需要程序员自己判断这个文本框是不是只读,然后再引入相应的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>