Question

我有select看起来像这样：

<select id="address">
  <option noodd="1-9" noeven="2-6">Address Name 1</option>
  <option noodd="3-5" noeven="2-10">Address Name 2</option>
  <option noodd="3-11" noeven="1-5">Address Name 3</option>
</select>

<select id="housenumber">
</select>

每当选择#address中的一个选项时，我需要#housenumber填充所选地址范围内的数字。因此，当选择Address Name 1时，我需要#housenumber看起来像这样：

<select id="housenumber">
  <option>1</option>
  <option>2</option>
  <option>3</option>
  <option>4</option>
  <option>5</option>
  <option>6</option>
  <option>7</option>
  <option>9</option>
</select>

有没有人明白如何做到这一点？

更新，我需要的是：

一个函数，用于查找每个noeven在option中指定的数字之间的所有相等数字。
一个函数，用于查找每个noodd在option中指定的数字之间的所有奇数。
将这两个列表组合在一起并将它们放入option元素
每当选择option #housenumber中的option时，将这些#address元素附加到{{1}}的函数

Answer 1

这样的事情应该这样做：

$('#address').change(function(){
    var $selected = $('option:selected',this);
    var odd = $selected.attr('noodd').split('-');
    var even = $selected.attr('noeven').split('-');

    var arr = [];
    for(var o = parseInt(odd[0],10);o<=parseInt(odd[1],10);o+=2){
       arr.push(o);  
    }

    for(var e = parseInt(even[0],10);e<=parseInt(even[1],10);e+=2){
       arr.push(e);  
    }

    var $housenumber = $('#housenumber');
    $housenumber.empty();
    $.each(arr.sort(function(a,b){return a-b;}),function(i,e){
       $housenumber.append($('<option/>').text(e));
    });
});

实例：http://jsfiddle.net/uhwMS/

几点说明：

您应该使用data-*属性而不是自定义属性。使您的选项节点看起来像<option data-odd="1-9" data-even="2-6">Address Name 1</option>，使其阅读更安全，例如var odd = $selected.data('odd').split('-');
你的第三个元素的偶数是奇数，给出了一些奇怪的结果。假设这只是发布问题的错误？

添加数字范围以选择选项

1 个答案: