代码之家 › 专栏 › 技术社区 › Boiler Bill

如何禁用不在表单内的选择框?

javascript

Boiler Bill · 技术社区 · 17 年前

当选择标记未嵌套在表单标记中时,我似乎无法禁用选择框。我尝试过的一些东西是(使用Firefox 3): (通过Jquery)

$("#mySelect").attr("disabled", true);
$("#mySelect").attr("disabled", "disabled");

(也)

document.getElementById('mySelect').disabled = true;
document.getElementById('mySelect').disabled = true;

这是HTML:

<select id="mySelect" onchange="updateChoice();">
<option value="1">First</option>
<option value="2" selected="">Second</option>
</select>

我必须在表单元素中包含此选择框吗?

2 回复 | 直到 17 年前

Tom 16 年前

简短回答:不,您不需要在表单中设置选择框。

你的JavaScript目前包含在哪里 body HTML中的标签?记住,如果你的页面头部包含内联JavaScript,那么它将在页面加载时触发。此时,选择框将不会被解析,因此,您的代码无法访问它以禁用它。

我不喜欢将JavaScript和标记混合在一起,但这个演示应该适用于所有意图和目的。

<html>
 <head>
  <title>JavaScript Select Demo</title>
 </head>
 <body>
    <select id="mySelect" onchange="updateChoice();">
        <option value="1">First</option>
        <option value="2" selected="">Second</option>
    </select>
 </body>
 <script type="text/javascript">
     document.getElementById('mySelect').disabled = true;
 </script>
</html>

如果出于某种原因,您必须将脚本保留在页面中而不是外部文件中,则可以设置一个事件处理程序,以便在页面加载后执行相同的功能。与其将代码保留在标记的底部,不如将其包含在head节点中:

 <head>
  <title>JavaScript Select Demo</title>
  <script type="text/javascript">
    window.onload = function() {
        document.getElementById('mySelect').disabled = true; ;
    }
 </script>
 </head>

最后,与其合并 onchange 在标记的属性中设置事件处理程序,您也可以在JavaScript中设置一个事件处理程序来执行相同的行为。 jQuery makes this really easy .

Andreas Grech 16 年前

使用jQuery库时,请确保您编写的代码始终包含在 $.ready 功能:

$(function () {
    //Type in your code here
});

这确保了 您编写的代码将在页面加载完成后执行

推荐文章

code-geek · Jquery根据单选按钮选择隐藏或显示文本字段

1 年前

Niobos · 如何/是否有方法使通用算法函数同时与同步和异步函数一起工作?

1 年前

Alex · 在轻量级中同时解构和不解构变量

1 年前

Ângelo Rigo · ReactJS映射:如何迭代[关闭]

1 年前

bairog · 从按属性筛选的对象数组字典中创建值数组

1 年前

KaiMcKiernan · 基于Math.random()的函数在另一个函数内不起作用[关闭]

1 年前

David Jeong · 浏览器不会为浏览器自动添加的某些标头发送CORS预检请求吗?

1 年前

user29519291 · 为不同的变量创建一个带有可重用Click函数的简单菜单

1 年前

user3472810 · Angular@Output/EventEmitter返回undefined

1 年前

lokiuucx · JS对象属性返回未定义,尽管对象属性应该有值

1 年前