选择框禁用或由其他选择框的选项启用 [英] Selectbox disabled or enabled by an option of an other selectbox

问题描述

我尝试创建一个关系/连接，其中包含2个选择框

I try to create a relation/connexion beetwen 2 selectbox

<form id="creation" name="creation">
<select name="select01" id="select01">
     <option value="01">01</option>
     <option value="02">02</option>
     <option value="03">03</option>
</select>

<select name="select02" id="select02">
     <option value="aa">aa</option>
     <option value="bb">bb</option>
     <option value="cc">cc</option>
</select>
</form>

我希望我的selectbox select02 在begening时被禁用，我点击 value02 或 value03 ，我们启用它，当我们点击 value01 时，禁用它。

I want that my selectbox select02 be disabled at the begening, and when i click on value02 or value03, we enable it, and when we click on value01, disable it.

目前有我的代码js。我尝试从其他功能（启用选择框的单选按钮）调整它，但似乎不起作用。我的列表是禁用的beging，但onclick不工作...

There is my code js for the moment. I try to adapt it from an other function (radiobutton enabling a selectbox) but it doesn't seem to work. My list is disable at the beging, but the onclick is not working ...

某些机构可以帮助我吗？

Some body can help me?

var oui = document.creation.select01[0];

document.getElementById("select02").disabled=true;
oui.onclick = function() {
document.getElementById("select02").disabled=false;
}

好的，现在，我用这段代码：

Ok, so NOW, i'm with this code:

<script>
var oui = document.select01;
document.getElementById("select02" ).disabled=true;
oui.onchange = function(){
document.getElementById("select02" ).disabled=false;
}
</script>

我改变了我的selec01的值，然后我的select02现在启用..但是我该如何定位只有2选择我的select01？

I change the value of my selec01, then my select02 is now enable .. but how can I target only 2 options of my select01 ?

推荐答案

试试这个：

Try this:

<form id="creation" name="creation" onchange="handleSelect()">
<select name="select01" id="select01">
     <option value="01">01</option>
     <option value="02">02</option>
     <option value="03">03</option>
</select>

<select name="select02" id="select02" disabled>
     <option value="aa">aa</option>
     <option value="bb">bb</option>
     <option value="cc">cc</option>
</select>
</form>

作为JS脚本：

And as a JS script:

 function handleSelect() {
     if (this.value == '01') {
         document.getElementById('select02').disabled = true;
     } else {
         document.getElementById('select02').disabled = false;
     }
 }

另外提示：探索jQuery，一个非常流行的JS框架（jquery.com）。您可以通过使用它来简单地完成您的任务。

And a tip: explore jQuery, a very popular JS framework (jquery.com). You can achieve your task very simply by using it.

这篇关于选择框禁用或由其他选择框的选项启用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！