0

我有一个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>

Whenever one of the options in #addressis selected, I need #housenumberto be filled with the numbers within the ranges of the address selected. 所以当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元素的函数
  • A function that appends these optionelements to #housenumberwhenever the corresponding optionin #addressis selected
4

1 回答 1

2

这样的事情应该这样做:

$('#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/

几点注意事项:

  1. 您应该使用data-*属性而不是自定义属性。使您的选项节点看起来像<option data-odd="1-9" data-even="2-6">Address Name 1</option>使阅读它们更安全,例如var odd = $selected.data('odd').split('-');

  2. 你的第三个元素有奇数偶数,给出一些奇怪的结果。假设这只是发布问题的错误?

于 2012-11-12T12:43:27.460 回答