jquery 中怎么让下拉框不能选择

 我来答
白卡PALA
2017-07-20 · 知道合伙人软件行家
白卡PALA
知道合伙人软件行家
采纳数:648 获赞数:3420
性能测试4年工作经验。

向TA提问 私信TA
展开全部

使用jquery动态的设置下拉框不能选择可以使用jquery的attr方法给select控件添加disabled属性,由于即使是被禁止选择了,下拉框还是会显示白色,这样可能会让用户产生 误解,可以再加上一个灰色的背景色,具体实现代码如下:

HTML

<!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">  
            <option value="1">项目经理</option>  
            <option value="2">总经理</option>  
            <option value="3">技术经理</option>  
            <option value="4">部门经理</option>  
        </select>  
    </body>  
</html>

JavaScript

$("#sel").attr("disabled","disabled").css("background-color","#EEEEEE;");

效果图:

百度网友64bfd0c
推荐于2017-09-14 · TA获得超过6573个赞
知道小有建树答主
回答量:1316
采纳率:0%
帮助的人:905万
展开全部
不知道你要哪种效果,所以我把2种不能选择的效果都给你写在下面好了:
1、下拉按钮控件变灰不可点,根本不能显示下拉列表中的选项
2、下拉按钮可以点,但是显示选项为灰色,点击无“选中”效果
例子代码如下:注意看代码的注释
(下面代码如果你想看显示效果,记得修改jquery.js的位置)

<html>
<head>
<script type="text/javascript" src="/jquery/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$(".field").change(function(){
$(this).css("background-color","#FFFFCC");
});
//$("#aaa").attr("disabled",true); //这行十对应第一种情况
});
</script>
</head>
<body>
<p>在某个域被使用或改变时,它会改变颜色。</p>
Enter your name: <input class="field" type="text" />
<p>Car:
<select class="field" name="cars" id="aaa">
//下面这4行是对应第二种情况,靠disabled="true"来控制
<option value="volvo" disabled="true">Volvo</option>
<option value="saab" disabled="true">Saab</option>
<option value="fiat" disabled="true">Fiat</option>
<option value="audi" disabled="true">Audi</option>
</select>
</p>
</body>
</html>

不明白请追问,如果对你有帮助,记得采纳~
本回答被提问者和网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
明白婆婆66
高粉答主

2018-03-31 · 醉心答题,欢迎关注
知道大有可为答主
回答量:176
采纳率:100%
帮助的人:4.3万
展开全部

使用jquery动态的设置下拉框不能选择可以使用jquery的attr方法给select控件添加disabled属性,由于即使是被禁止选择了,下拉框还是会显示白色,这样可能会让用户产生 误解,可以再加上一个灰色的背景色,具体实现代码如下:

HTML

<!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">  

<option value="1">项目经理</option>  

<option value="2">总经理</option>  

<option value="3">技术经理</option>  

<option value="4">部门经理</option>  

</select>  

</body>  

</html>JavaScript

$("#sel").attr("disabled","disabled").css("background-color","#EEEEEE;");

效果图:

本回答被网友采纳
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
yugi111
2014-02-13 · TA获得超过8.1万个赞
知道大有可为答主
回答量:5.1万
采纳率:70%
帮助的人:1.3亿
展开全部
$('select').prop({'disabled',true});
已赞过 已踩过<
你对这个回答的评价是?
评论 收起
收起 更多回答(2)
推荐律师服务: 若未解决您的问题,请您详细描述您的问题,通过百度律临进行免费专业咨询

为你推荐:

下载百度知道APP,抢鲜体验
使用百度知道APP,立即抢鲜体验。你的手机镜头里或许有别人想知道的答案。
扫描二维码下载
×

类别

我们会通过消息、邮箱等方式尽快将举报结果通知您。

说明

0/200

提交
取消

辅 助

模 式