2

页面上有 3 个单选按钮和一个选择框。单击第一个单选按钮然后在选择框中它将分别显示与第一个单选按钮相关的内容...选择第一个单选按钮它工作正常，当我选择第二个单选按钮时，选择框高度正在减小，无法看到完全一样，第三个也一样，它发生在 chrome 中，FF 工作正常

我的代码

 <label><input type="radio" name="reward-venue" value="Fly" checked /><div class="radio-icon Fly-sprite"></div></label>
    <label><input type="radio" name="reward-venue" value="Drive" /><div class="radio-icon Drive-sprite"></div></label> 
    <label><input type="radio" name="reward-venue" value="Stay" /><div class="radio-icon Stay-sprite"></div></label> 



 <div>
    Reward program
      <select name="program">
        <option value=""> - select one - </option>
        {{#fly_programs}}
        <optgroup label="Fly">
          {{#reward_program}}
          <option value="{{reward_program_id}}">{{name}}</option>
          {{/reward_program}}
        </optgroup>
        {{/fly_programs}}
        {{#drive_programs}}
        <optgroup label="Drive">
          {{#reward_program}}
          <option value="{{reward_program_id}}">{{name}}</option>
          {{/reward_program}}
        </optgroup>
        {{/drive_programs}}
        {{#stay_programs}}
        <optgroup label="Stay">
          {{#reward_program}}
          <option value="{{reward_program_id}}">{{name}}</option>
          {{/reward_program}}
        </optgroup>
        {{/stay_programs}}
      </select>
  </div>

用于隐藏和显示的 js

  var show_optgroup = $('optgroup[label=' + venue_name + ']')
    , hide_optgroup = $('optgroup[label!=' + venue_name + ']')
    ;

    show_optgroup.show();
    show_optgroup.children('option').show();
    hide_optgroup.hide();
    hide_optgroup.children('option').hide();

    this.$el.find('option:selected').removeAttr('selected');
    this.$el.find('option:first').attr('selected', 'selected');
    $.uniform.update();
    return this;
  },
4

1 回答 1

0

像这样的东西可以吗？

$('[name="reward-venue"]').click(function(){
    $('optgroup[label!='+$(this).val()+']').hide();
    $('optgroup[label!='+$(this).val()+']').children('option').hide();  
    $('optgroup[label='+$(this).val()+']').show();
    $('optgroup[label='+$(this).val()+']').children('option').show();
    $('[name="program"]')[0].selectedIndex=0;
});​
于 2012-12-21T14:29:17.770 回答