Javascript 使用jQuery将筛选器应用于选择框

我有一个网页，它有两个

框：

Hadoop发行版

和

Hadoop版本

。 我还有一张

发行版

和

版本

之间的地图：

function hadoop_map() {
      var hash = Object();
      // replace this part of the code by a jQuery post 
      hash['Cloudera'] = ['4', '5'];
      hash['Apache'] = ['2.4', '2.3.0', '2.2.0', '2.1.1', '2.1.0', '2.0.6', '1.2.1'];
      hash['Hortonworks'] = ['2.1', '2.0', '1.3'];
      hash['Pivotal'] = [];
      hash['MapR'] = [];

      return hash;
   }

因此，一个选择是：

<select id="hadoop_dist">
    <option>Cloudera</option>
    <option>Hortonworks</option>
    <option>Apache</option>
    <option>MapR</option
    <option>Pivotal</option>
</select>

克劳德拉
钟表厂
阿帕奇
MapR由于数据的性质，一种方便的方法是在每次数据更改时构造它。有点低效，但比其他选项可读性更强，更易于扩展：

var hadoopMap = hadoop_map();

$('#hadoop_dist').change(function() {
    var selectedOption = $(this).val();
    var $options = $.map(hadoopMap[selectedOption], function(value) {
        return $('<option>').html(value);
    });

    $('#hadoop_version').empty().append($options);
});

var hadoopMap=hadoop_map（）；
$（'#hadoop_dist'）.change（function（）{
var selectedOption=$（this.val（）；
var$options=$.map（hadoopMap[selectedOption]，函数（值）{
返回$（''）.html（值）；
});
$（'#hadoop_version'）.empty（）.append（$options）；
});
通过使用

.find('option').remove() 

然后在所选has属性的数组中循环并使用

.append('<option>' + item + '</option').

.append（''+项+'
.append('<option>' + item + '</option').