Question

我有2个组合框。我想基于组合框1选择在组合框2中显示特定数据。

但是我想让它成为准时选择...所以当我按下我想要的组合框1选项时，组合框2充满了匹配此选择的数据。

我试图在combobox 1选项上添加一个on click功能，但是当我点击它们时它没有用... 那么有一些方法可以这样做吗？

Answer 1

在第一个下拉列表中分配change事件处理程序，然后根据所选值，获取应该放在第二个下拉列表中的值。这是一个典型的制造商 - ＆gt;模型示例：

标记：

<select id="manufacturers">
    <option></option>
    <option value="Audi">Audi</option>
    <option value="Toyota">Toyota</option>
</select>

<select id="cars">
</select>

JavaScript的：

var cars = {
    Audi: [ 'A2', 'A3', 'A4' ],
    Toyota: [ 'Auris', 'Avalon', 'Yaris' ]
};

$("#manufacturers").change(function () {
   var $this = $(this);
   var selectedValue = $this.val();
   if (selectedValue) {
     var $cars = $("#cars").empty();
     var newCars = cars[selectedValue];
     $.each(newCars, function () {
         console.log(this);
       $("<option>" + this + "</option>").appendTo($cars);
     });
   }
});

的 DEMO

Answer 2

您应该在select标记本身上使用更改（而不是单击）事件（而不是在选项标记上）。例如：

$('#combo1').change(function() {
     // Load new content for #combo2 here
});

Answer 3

$('select.option1').change(function() {
    // fill option2 with data from somewhere
});

Answer 4

Chained是用于链式选择的简单jQuery插件

http://www.appelsiini.net/projects/chained

我在一些项目中使用过此插件，它可以正常运行并且符合预期。随意试试吧......

根据组合框选择显示特定数据

4 个答案: