设置select下拉框禁用

最新推荐文章于 2023-11-30 21:54:54 发布

原创最新推荐文章于 2023-11-30 21:54:54 发布 · 2.9k 阅读

1 ·

CC 4.0 BY-SA版权

JavaScript 专栏收录该内容

43 篇文章

订阅专栏

本文介绍了两种在HTML中使下拉框不可用的方法：一是通过JavaScript阻止选择变化的效果；二是直接设置disabled属性，使下拉框变为只读状态且选项呈灰色显示。此外，还提供了如何使用jQuery来添加或移除disabled属性的方法。

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

<select style="width:195px" name="role" id="role" onfocus="this.defaultIndex=this.selectedIndex;"
onchange="this.selectedIndex=this.defaultIndex;">

这种方法可以使下拉框和平常没有区别，看起来没有任何不同。唯一不同的就是下拉并单并选择之后，选了和没有选一样的。就是无视客户的选择。

2.设置disabled属性

<select style="width:195px" name="role" id="role" disabled="disabled">

这个看起来更直接，直观就是有只读的感觉，也不可以点击和下拉了。里面的字也会变成灰色

当属性设置为"disabled"时，提交表单时，select的值无法传递，提交前移除disabled属性$("#role").removeAttr("disabled");

jquery添加属性$("#role").attr("disabled","disabled");

在body中用onload:

<body onload="myfunction()">

2、在脚本中用window.onload:

<script type="text/javascript">
function myfun()
{
alert("this window.onload");
}
/*用window.onload调用myfun()*/
window.onload=myfun;//不要括号
</script>

下面这个例子在页面完成加载之后改变id_1的背景颜色。

<script language="javascript">
function myfun() {
document.getElementById("id_1").style.background="#000";// 改变背景颜色
}
// 用js实现在加载完成一个页面后自动执行一个方法
/*用window.onload调用myfun()*/
window.onload=myfun;//不要括号
</script>