Question

我正在尝试使用javascript - jquery实现链式过滤器下拉列表。

我需要的解决方案是http://www.codeassembly.com/Simple-chained-combobox-plugin-for-jQuery。

但是我无法使用此解决方案，因为它取决于PHP文件。有没有办法单独使用javascript（客户端和/或服务器端）来实现它？

非常感谢

Answer 1

对于一个不需要任何其他数据源或数据文件的简单jQuery插件。您可以使用：

http://code.google.com/p/jquery-option-tree/

所有选项都在JS代码中定义，希望您不会拥有大型数据集。

<input type="text" name="demo1" />

    var option_tree = {
       "Option 1": {"Suboption":200},
       "Option 2": {"Suboption 2": {"Subsub 1":201, "Subsub 2":202},
             "Suboption 3": {"Subsub 3":203, "Subsub 4":204, "Subsub 5":205}
            }
    };

    $('input[name=demo1]').optionTree(option_tree);

Answer 2

对于公然的自我推销感到抱歉，但我之前遇到了同样的问题并编写了Chained Selects插件以满足我的需求。它与Glennular提供的类似，但有一些差异。它不是从JSON数组构建选择，而是使用HTML的类属性来确定应该显示哪些选项。例如：

<select id="mark">
  <option value="">--</option>
  <option value="bmw">BMW</option>
  <option value="audi">Audi</option>
</select>
<select id="series">
  <option value="">--</option>
  <option value="series-3" class="bmw">3 series</option>
  <option value="series-5" class="bmw">5 series</option>
  <option value="series-6" class="bmw">6 series</option>
  <option value="a3" class="audi">A3</option>
  <option value="a4" class="audi">A4</option>
  <option value="a5" class="audi">A5</option>
</select>

然后，您将使用以下JavaScript链接它们：

$("#series").chained("#mark");

或者如果你喜欢更长的形式：

$("#series").chainedTo("#mark");

您可能还想查看单独的demo page。

的来源

JQuery链式过滤器下拉列表

2 个答案: