使用For循环中的选定选项值

Use Selected Options Value in For Loop

本文关键字：选项 For 循环 使用      更新时间：2023-09-26

下午好。

我正在尝试在for循环中使用选项框中的选定值。

理论上，例如，如果用户选择3个，Javascript将用数组中的水果填充3个框。

有人能给我指正确的方向吗？我也附上了Codepen链接。

function changeText(){
    var e = document.getElementById('selectbox');
    var strUser = e.options[e.selectedIndex].value;
    for (var i=0; i<=strUser; i++) {
    document.getElementById('boldStuff').innerHTML = randomFruit + strUser;
    }
}

http://codepen.io/jameswinfield/pen/aNWRKm

ID元素对于整个dom应该是唯一的。您正在为boldStuff多次使用它。如果你想像那样抓住它们，你应该使用一个类。

以下是一个可以满足您需要的版本：http://codepen.io/anon/pen/KzmGLP?editors=0010

请记住，设置每个框的值，即使是隐藏的框。你必须在每盒中随机获得一个新的水果，否则它们都会有相同的水果。

我将所有id="boldStuff"更改为class="boldStuff"，

抓住所有粗体字var boldStuffs=document.getElementsByClassName（'boldStuf'）；

并在每一个粗体上循环

for (var i = 0; i < boldStuffs.length; i += 1) {  
    //And set the value of each boldStuff to a new random fruit.  
    boldStuffs[i].innerHTML = getRandomItem(fruitsArray);  
}

下面的行也只运行一次，所以无论有多少盒子，它们都会有相同的水果（因为randomFruit从未改变）

var randomFruit = fruitsArray[Math.floor(Math.random() * fruitsArray.length)];

你可以使用一个函数来获取随机的水果，比如这样的：

function getRandomItem(arr) {
  return arr[Math.floor(Math.random() * arr.length)];
}

然后使用getRandomItem(fruitsArray);得到一个随机的水果。

相关文章：