jquery - jquery级联下拉问题

Question

我正在使用 jquery 根据第一个和第二个菜单的选择来调出第二个和第三个下拉菜单。

我采用的方法是将所有后续下拉菜单设置为 style="display:none" 并使用 .toggle() 功能在上一个下拉菜单中选择时显示它们。

When an item is selected a digit is added to the end to maintain unique id's.

如您所见，html 是不完整的，但如果您从第一个中选择“Mortice”，从第二个中选择“Deadlock”，则足以对其进行测试。

到目前为止，我已经为所有项目（以及两个具有有效 html 的项目）提供了第一个菜单，但即使这样也停止了工作。

现在只有第一个菜单（Mortice）中的第一个选项会弹出另一个菜单。

任何关于我做错了什么或如何做得更好的帮助将不胜感激。

非常感谢，

缺口。

score 4 · Accepted Answer

而不是使用.click()查看使用.change().

$('#type_1').change(function() {
    var o = $(this).find(":selected");
    $('#' + o.attr("id") + '2').toggle();
});

dom中的每个元素也id必须是唯一的。（您在类型 2 下的两个下拉菜单具有相同的 ID）您的下拉菜单选择器应该类似于

$("select[name='type_2']").change(function() {
    var o = $(this).find(":selected");
    $('#' + o.attr("id") + '2').toggle();
});

这是关于jsfiddle的一个稍微修改的示例。

1 回答 1