Question

如何修改代码，以便当我从第一个下拉菜单中选择一个选项时，第二个下拉菜单变为可编辑，否则第二个下拉菜单应该是只读的，如果第一个下拉菜单中的选项菜单是＆＃34;默认＆＃34;那么第二个下拉菜单应该是只读的。

    <!DOCTYPE html>
<html>

<head>
<script type="text/javascript">
function mySecondFunction() {
    document.getElementById("mySelection").disabled = false;
}

</script>

</head>
<body>

<form action="">
<select name="cars" onload="mySecondFunction()">
<option value="default">default</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
<br>
<select disabled name="cars" id="mySelection">
<option value="Action1">Volvo</option>
<option value="Action2">Saab</option>
<option value="Action3">Fiat</option>
<option value="Action4">Audi</option>
</select>
</form>

</body>
</html>

Answer 1

看看大写字母：

document.getElementById("MySelection").disabled = false;
<select disabled name="cars" id="mySelection">

第一个是＆＃34; M＆＃34;和＆＃34; m＆＃34;

的第二个

Answer 2

您使用MySelection

拼错了mySelection

在JS中你有document.getElementById("MySelection") // notice the uppercase M

并在HTML中id="mySelection"

当窗口加载时，将第二个选择设置为false，并将onChange事件添加到第一个选择，将第二个事件设置为enabled / true ...这就是你想要的吗？

<!DOCTYPE html>
<html> 
<head>
<script type="text/javascript">

window.onload = function(){
    document.getElementById("mySelection").disabled = true;
};

function mySecondFunction() {
    document.getElementById("mySelection").disabled = false;
}

</script>

</head>
<body>

<form action="">
<select name="cars" onchange="mySecondFunction()">
<option value="default">default</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
<br>
<select name="cars" id="mySelection">
<option value="Action1">Volvo</option>
<option value="Action2">Saab</option>
<option value="Action3">Fiat</option>
<option value="Action4">Audi</option>
</select>
</form>

</body>
</html>

如果用户在更改值后在第一个菜单中选择“默认”，则可能需要将第二个选择设置为禁用

Answer 3

JavaScript选择器区分大小写。你的错误在mySelection id：

document.getElementById("MySelection").disabled = false;
<select disabled name="cars" id="mySelection">

Answer 4

您必须使用内部正文标记。 fiddle

<head>


</head>
<body onload="mySecondFunction()">

<form action="">
<select name="cars" >
<option value="default">default</option>
<option value="saab">Saab</option>
<option value="fiat">Fiat</option>
<option value="audi">Audi</option>
</select>
<br>
<select disabled name="cars" id="mySelection">
<option value="Action1">Volvo</option>
<option value="Action2">Saab</option>
<option value="Action3">Fiat</option>
<option value="Action4">Audi</option>
</select>
</form>

</body>
<script type="text/javascript">

function mySecondFunction() {
alert("aaa");
    document.getElementById("mySelection").disabled = false;
}

</script>
</html>

Answer 5

正如其他人指出您错误拼写了第二个<select>的ID，但您使用了错误的事件，onchange就是您想要的而不是onload。

function mySecondFunction() {
  document.getElementById('mySelection').disabled = false;    
}

<form action="">
    <select name="cars" onchange="mySecondFunction();">
        <option value="default">default</option>
        <option value="saab">Saab</option>
        <option value="fiat">Fiat</option>
        <option value="audi">Audi</option>
    </select>
    
    <br />
        
    <select disabled="disabled" name="cars" id="mySelection">
        <option value="Action1">Volvo</option>
        <option value="Action2">Saab</option>
        <option value="Action3">Fiat</option>
        <option value="Action4">Audi</option>
    </select>
</form>

但是考虑使用jQuery并在javascript中附加你的事件，而不是将它们存储在html中。

Answer 6

试试这个：

替换

document.getElementById("mySelection").disabled = false;

用这个

document.getElementById("mySelection").removeAttribute('disabled');

另外，您可能想要更改

onload="mySecondFunction()"

用这个：

onchange="mySecondFunction()"

希望这有帮助。

Answer 7

如果要删除特定值中的禁用，例如（Saab）

See fiddle 注意：将脚本放在b4头标记

中

    function mySecondFunction()
{
 var ddl = document.getElementById("1");
 var selectedValue = ddl.options[ddl.selectedIndex].value;
    if (selectedValue == "saab")
   {
    document.getElementById("mySelection").disabled = false;
   }else {
    document.getElementById("mySelection").disabled = true;
   }
}

<form action="">
    <select id="1" name="cars" onchange="mySecondFunction()">
        <option value="default">default</option>
        <option value="saab">Saab</option>
        <option value="fiat">Fiat</option>
        <option value="audi">Audi</option>
    </select>

    <br />

    <select disabled="disabled" name="cars" id="mySelection">
        <option value="Action1">Volvo</option>
        <option value="Action2">Saab</option>
        <option value="Action3">Fiat</option>
        <option value="Action4">Audi</option>
    </select>
</form>

<强>更新 See fiddle

function mySecondFunction()
{
 var ddl = document.getElementById("1");
 var selectedValue = ddl.options[ddl.selectedIndex].value;
    if (selectedValue == "default")
   {
    document.getElementById("mySelection").disabled = true;
   }else {
    document.getElementById("mySelection").disabled = false;
   }
}

Answer 8

将onload更改为onchange。

<select name="cars" onchange="mySecondFunction();">

Javascript代码无效

8 个答案: