如何设置select下拉禁止选择
Posted odejsjhshw
tags:
篇首语：本文由小常识网(cha138.com)小编为大家整理，主要介绍了如何设置select下拉禁止选择相关的知识，希望对你有一定的参考价值。
如何设置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>3、问题说明
利用disabled="disabled"和background-color进行对select下拉框设置，这样才显示被禁止操作
再分享一下我老师大神的人工智能教程吧。零基础！通俗易懂！风趣幽默！希望你也加入到我们人工智能的队伍中来！http://www.captainbed.net
以上是关于如何设置select下拉禁止选择的主要内容，如果未能解决你的问题，请参考以下文章