JQuery链式过滤器下拉列表

问题描述：

我试图用javascript实现链式过滤器下拉列表 - jquery。JQuery链式过滤器下拉列表

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

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

非常感谢

答

对于一个简单的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);

似乎我投了这个有点太早 - 试图制作一个表单，并认识到一些关键功能缺失：1）我不能在每个下拉列表中设置不同的默认选择消息，例如“请选择国家”，然后选择“请选择状态“; 2）命名每个子下拉菜单似乎不可能，它将“_”附加到它上面，但是然后将整个选择值放入一个字段中（工作正常，但命名每个子下拉菜单会很好）。 – Sologoub 2011-08-15 17:26:54

@Sologoup 1）您可以传入一个empty_value参数来设置默认消息。看看演示页面上的例子。 – Glennular 2011-08-15 17:33:29

答

对不起公然自我宣传，但我有同样的问题，前面写了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。

只是关于你的链式选择的问题。如果我想让选项“3系列”同时属于宝马和奥迪？ – Carven 2012-04-26 19:51:26

@xEnOn我看着他的东西，显然你可以添加多个类。 'value =“series-3”class =“bmw audi”' – scragar 2012-06-21 17:08:52

@scragar我以前尝试添加多个类，但它似乎没有工作。 – Carven 2012-06-21 17:37:59

JQuery链式过滤器下拉列表

相关推荐