Question

我想根据表格中的选定值显示/隐藏其他提交按钮我没有使用JavaScript的经验，因此我只尝试修改网络上的示例很遗憾，我无法找到与rails <%= form_for @discount, url: {action: "create"} do |f| %> <%= f.label :name, "Name" %><br /> <%= f.text_field :name, placeholder: "Name" %><br /> <%= f.label :description, "Description" %><br /> <%= f.text_area :description, placeholder: "Description" %><br /> <%= f.label :with_codes, "Type" %><br /> <%= f.select :with_codes, [['Without Codes', false],['With Codes', true]], :selected => :with_codes %><br /> <div id="row_dim"> <%= f.submit "Manage Codes" %><br /> </div> <script> $(function() { $('#row_dim').hide(); $('#with_codes').change(function(){ if($('#with_codes').val() == true) { $('#row_dim').show(); } else { $('#row_dim').hide(); } }); }); </script> <%= f.submit "Draft" %> <%= f.submit "Save" %> <% end %>相关的任何内容这是我到目前为止所尝试的：

body {
    background: rgba(0, 0, 0, 0) url("../images/mom-bg.jpg") no-repeat scroll 0 0 / cover ;
    font: 16px "anitypewritermedium";
    margin: 0 !important;
    padding: 0 !important; 
}

此脚本仅隐藏我的提交按钮，但我认为在表单中识别选定的值存在问题。

Answer 1

首先：您确定该选项的标识为with_codes而不是discount_with_codes吗？

其次，您应该将select的值作为字符串进行比较。考虑到这两个问题，以下代码应该有效：

<script>
   $(function() {
     $('#row_dim').hide();
     $('#discount_with_codes').change(function(){
       if($('#discount_with_codes').val() == 'true') {
         $('#row_dim').show();
       } else {
         $('#row_dim').hide();
       }
     });
   });
</script>

Answer 2

或者也许这样（更简洁）：

$(function() {
  $("#row_dim").toggle($("#discount_with_codes").val() == 'true');
  $("#discount_with_codes").change(function() {
    $("#row_dim").toggle($(this).val() == 'true');
  });
});

编辑：哎呀，看起来你已经接受了答案。但无论如何我都会离开这里。

Answer 3

试试这个

<script>
 function(){
   $('#row_dim').hide();
   $('#with_codes').change(function() {
      if($('#with_codes').val() == true)
      {
        $('#row_dim').show();
      } 
      else
      {
        $('#row_dim').hide();
      }
   });
 }()
</script>

根据所选值显示/隐藏提交按钮

3 个答案: