设置 select 选中值不可改动，即只读

最新推荐文章于 2023-11-28 13:29:54 发布

烟雨青山

最新推荐文章于 2023-11-28 13:29:54 发布

阅读量4.5k

点赞数 1

CC 4.0 BY-SA版权

分类专栏： html 文章标签： html

本文链接：https://blog.csdn.net/qq1036053871/article/details/45039019

html 专栏收录该内容

7 篇文章

订阅专栏

本文介绍了一种通过使用HTML和CSS阻止用户交互的方法来禁用Select控件的操作。通过设置onfocus属性使Select控件失去焦点，并使用一个透明的绝对定位Div层覆盖在Select控件上以拦截鼠标点击。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

用个浮动层盖住select不给操作就行，另外给 select 加上了一个 onfocus="this.blur();"，防止客户用键盘来修改值。

	
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<span style="position:relative">
<select onfocus="this.blur();"><option value="1">1</option><option value="2">2</option><option value="3">3</option></select>
<div style="position:absolute;width:100%;height:100%;left:0px;top:0px;background:#fff;opacity:0;filter:alpha(opacity=0)"> </div>
</span>