0

请查看我的演示小提琴

如果您从菜单中选择一个选项，它将与另一个相应的选项相匹配。

在第一个菜单中，如果您选择一种考试类型，它将与适当的课程结果相匹配。

此外，第二个菜单允许您选择课程，并显示相应的考试结果。

例如 - 如果您选择美国文学或教育心理学导论，则显示的结果是自由选修课

但是，如果在下面的菜单中选择自由选修课，则出现的唯一课程是美国文学，而不是其他教育心理学导论。

如何选择Free Elective并让它显示相关的课程列表，而不仅仅是一个？

这是我的JS ...

$(function() {
    $('#clepSelector').change(function(){
        $('.class').hide();
        $('#' + $(this).val()).fadeIn();
    });
});

$(function() {
    $('#classSelector').change(function(){
        $('.clep').hide();
        $('#' + $(this).val()).fadeIn();
    });
});
4

1 回答 1

2

首先，在 DOM 中不能有重复的 ID。

因此，删除free_elective为id& 使其成为class.

HTML

<div class="clep free_elective" style="display: none"> American Literature </div>
<div class="clep free_elective" style="display: none"> Introduction to Educational Psychology </div>

jQuery

$('#classSelector').change(function(){
    $('.clep').hide();
    $('.' + $(this).val()).fadeIn();
});

JSFIDDLE 演示

于 2013-10-22T19:46:07.340 回答