我有一个关于如何在表中的复选框中循环的问题。
我想做的是在一个表中的每行创建两个复选框,以及一个下拉菜单。如果选中了每行的两个复选框,我将在javascript中运行一个条件。如果一行中的两个复选框都与下拉菜单选项一起被选中,我将运行一个条件菜单。
所以我想循环检查表的每一行,检查是否选中了这两个复选框。我认为另一种方法是使用div和class。我该怎么做?
下面的示例代码不在表中,但到目前为止,我只是为了让复选框和下拉菜单正常工作。
<html>
<div class="container">
<input type="checkbox" class="checks" value ="Apple">Apple<br>
<input type="checkbox" class="checks" value ="BananaValue">Banana<br>
<input type="checkbox" class="checks" value ="Carrot">Carrot<br>
<form>
Select your favorite fruit:
<select id="mySelect" /*onchange="run();"*/>
<option value="apple">apple</option>
<option value="orange">Orange</option>
<option value="pineapple">Pineapple</option>
<option value="banana">Banana</option>
</select>
</form>
<input type="submit" onclick="run()" />
<script>
function run() {
var checks = document.getElementsByClassName('checks');
var str = '';
for (i = 0; i < 3; i++) {
if (checks[i].checked === true) {
str += checks[i].value + " ";
}
}
alert(str);
}
</script>
</div>
</html>
2条答案
按热度按时间imzjd6km1#
更新:代码将被更新以处理您的评论中的信息。它将仅在单击一个按钮时运行
奥利格:我注解掉了(但保留了)代码,以备以后需要。这里有一个你想要的工作示例(我想)。在window.load侦听器中,我们首先循环所有行,查看是否有任何行已准备好运行条件。然后我们建立了
change
表中每个表单元素上的侦听器。侦听器侦听更改事件,然后运行行检查。mutmk8jj2#
我对问题的初始条件的理解略有不同,因此这可能不足以作为可接受的答案。
我读到,每排只允许2种蔬菜。
仅当满足#1条件时,才添加精选水果。
考虑到这一点,下面是我提交的解决方案。