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>

のオプションの1つを選択するときはいつでも、選択したアドレスの範囲内の番号を入力する#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これら2つのリストを組み合わせて要素に入れる関数
  • 対応するinが選択されるたびにこれらのoption要素を追加する関数#housenumberoption#address
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. 3番目の要素には偶数の奇数があり、奇妙な結果が得られます。これは質問の投稿でエラーが発生しただけだと思いますか？

于 2012-11-12T12:43:27.460 に答える