2016-06-21 150 views
1

我有问题可以从下面的代码更改选项的值,根据其他选择选择哪些更改,但是我想更改值选择ID = “numbList”,感谢....根据另一个选定的下拉列表更改下拉列表中的选项值

<!DOCTYPE html> 
<html> 
<body> 

<select id="diffList" onchange="changeList()"> 
    <option value="">-- Difficulty --</option> 
    <option value="1">Easy</option> 
    <option value="2">Medium</option> 
    <option value="3">Difficult</option> 
</select> 

<select id="numbList"></select> 

<script> 
window.difficulty = {}; 
window.difficulty['1'] = [1,2,3]; 
window.difficulty['2'] = [4,5,6]; 
window.difficulty['3'] = [7,8,9]; 

function changeList() { 
    var diffList = document.getElementById("diffList"); 
    var numbRange = document.getElementById("numbList"); 
    var selectDiff = diffList.options[diffList.selectedIndex].value; 
    while(numbRange.options.length) 
    { 
     numbRange.remove(0); 
    } 
    var diff = window.difficulty[selectDiff]; 
    if(diff) 
    { 
     var i; 
     for(i = 0; i < diff.length; i++) 
     { 
      var difficulty = new Option(diff[i], i); 
      numbRange.options.add(difficulty); 
     } 
    } 
} 
</script> 

</body> 
</html> 
+0

我不明白什么是不工作。你想让numbList的值为1-9而不是0-2? – mollwe

+0

'remove()'不会做你认为它正在做的事情。相反,您应该使用父元素中的'removeChild()'。 – grochmal

+0

@mollwe ....是的,我只是想改变numbList上的值,因为他自动出现,(0,1,2)是它的值,我想改变 – eff

回答

1

只需使用diff [I]的文字与价值选择:

... 
for(i = 0; i < diff.length; i++) 
{ 
    var value = diff[i]; 
    var difficulty = new Option(value, value); 
    numbRange.options.add(difficulty); 
} 
... 

正如前值从选择删除它会选择第一个新选项。所以你不需要设置numbList的值。

要以编程方式设置numbList的值,例如可以仅执行numbList.value = 1;

+0

我认为它只是添加变量,而不是更改值 – eff

+0

现在我已经失去了你,我们在谈论什么价值?对我来说,NumbList.value首先没有任何价值,那么当我选择“容易”Numblist.value是1,当我选择“中等”,Numblist.value是4等我错过了什么? – mollwe

+0

谢谢讨论,对不起,如果我的回复太长...我的意思是当我选择diffList“easy”,然后选择NumbList转换为“1,2,3”时,我选择diffList“中”,选择NumbList转换为“4 ,5,6“,当我选择diffList”困难“时,选择NumList转换为”7,8,9“,我的意思是改变NumbList的值,即改变NumbList的值1,2, 3 - NumbList NumbList 4,5,6和7,8,9 ...谢谢 – eff

相关问题