使用 jQuery on rails 应用程序隐藏和显示（或禁用启用）选择字段答案

【问题标题】：Using jQuery on rails app to hide and show (or disable enable) Select Fields使用 jQuery on rails 应用程序隐藏和显示（或禁用启用）选择字段
【发布时间】：2015-01-04 15:50:08
【问题描述】：

基本上，我希望用户只选择其中一个字段，因此在任何情况下都选择一个或两个。

我如何编写 Jquery 代码，以便如果其中任何一个从其默认值更改，另一个字段要么隐藏要么禁用？

谢谢

这是我的两个选择字段：

<div class="control-group" id="sel1">
  <%= f.label "Assigne", :class => 'control-label' %>
  <div class="controls" id="sel1">
    <%= f.select(:user_id,  [['Team', 0]] + User.all.collect { |p| [p.email, p.id]}, :id => 'sel1') %>
  </div>
</div>
<div class="control-group">
  <%= f.label "Team", :class => 'control-label' %>
  <div class="controls">
    <%= f.select(:team_id,  [['Department', 0]] + Team.all.collect { |p| [p.name, p.id]}, :id => 'sel2') %>
  </div>
</div>

编辑：

这是我自己写的：

<script>
  $(function(){
    $('#sel1').on('change',
    function(){
     if ($('#sel1').has('option').length > 5)
      {
        $('#sel2').hide();
      }
     else
      {
        $('#sel2').show();
      }
    })
  });
</script>

但它不起作用，它只能像这样工作：

<script>
  $(function(){
    $('#sel1').on('change',
    function(){
        $('#sel2').hide();
    })
  });
</script>

但是，如果该领域被尊崇为无，我不会再展示它。

有什么想法吗？

【问题讨论】：

标签： jquery ruby-on-rails ruby ruby-on-rails-3

【解决方案1】：

你需要这样的东西：

$('#sel1').on('change',
    function(){
     if ($('#sel1').find('option:selected').val() !== "")
      {
        $('#sel2').hide();
      }
     else
      {
        $('#sel2').show();
      }
    });

这是html源代码：

<body>
<select id="sel1">
  <option val=""></option>
  <option val=0>0</option>
  <option val=1>1</option>
</select>

<select id="sel2">
  <option val=""></option>
  <option val=0>0</option>
  <option val=1>1</option>
</select>

</body>

您可以在这里观看实际操作：http://jsbin.com/bigasitibe/2/edit

【讨论】：

好的，这样就可以了，谢谢！ ...但是，如果我的选项变回默认值，我需要重新显示第二个字段，我该怎么做？
您可以检查$('#sel1').find('option:selected').val() 的默认值。不适合空的...

【解决方案2】：

这假设您在页面上没有任何其他选择。如果你这样做了，也许可以在父 div 中添加一个像 mutually-exclusive-select 这样的类。

$ ->
  $selects = $('select') # or something more specific
  $selects.on 'change', ->
    $el = $(@)
    if $el.val().length
      $selects.not('#' + $el.attr('id')).attr('disabled', 'disabled')
    else 
      $selects.removeAttr('disabled')

【讨论】：