如何设置select下拉禁止选择

最新推荐文章于 2024-06-17 11:23:01 发布

采精小蝴蝶

最新推荐文章于 2024-06-17 11:23:01 发布

阅读量1.3w

点赞数 2

分享一下我老师大神的人工智能教程！零基础，通俗易懂！http://blog.csdn.net/jiangjunshow

也欢迎大家转载本篇文章。分享知识，造福人民，实现我们中华民族伟大复兴！

如何设置select下拉禁止选择

1、问题背景

设置select下拉框不能选择，利用disabled="disabled"，但是颜色且显示白色，容易引起用户误解

2、问题实现

（1）只禁止

<!DOCTYPE html><html> <head>  <meta charset="UTF-8">  <title>如何设置select下拉禁止选择</title>  <script src="../js/jquery-1.12.4.js"></script>  <script>   $(function(){       });  </script> </head> <body>  <select id="sel" style="width: 200px; " disabled="disabled">   <option value="1">项目经理</option>   <option value="2">总经理</option>   <option value="3">技术经理</option>   <option value="4">部门经理</option>  </select> </body></html>

（2）禁止且颜色为灰色

<!DOCTYPE html><html> <head>  <meta charset="UTF-8">  <title>如何设置select下拉禁止选择</title>  <script src="../js/jquery-1.12.4.js"></script>  <script>   $(function(){       });  </script> </head> <body>  <select id="sel" style="width: 200px; background-color: #EEEEEE;" disabled="disabled">   <option value="1">项目经理</option>   <option value="2">总经理</option>   <option value="3">技术经理</option>   <option value="4">部门经理</option>  </select> </body></html>