Question

在我的rails视图中（我是rails的新手），我想在复选框设置为true时显示div。

我该怎么做？

我想过使用

<%= check_box_tag 'advancedtagging', false %> Tag details

结合：

<% if advancedtagging = '1' %>
<div class="row">
    <%= render 'tags/advanced', :object => @annotation %>
</div>
<% end -%>

这是我的观点：

<div class="row">
<div class="col-md-4">
    <div data-spy="affix">
            <%= link_to 'Close', annotation_path(@annotation), :class => "btn btn-link" %>
            <%= link_to 'List' , annotations_path, :class => "btn btn-link" %>
            <%= check_box_tag 'advancedtagging', false %> Tag details
            <%= render 'tags/form', :object => @annotation %>
            <br>
        <div class="panel panel-default" id="annotationResults">
            <%= render 'tags/tag_list', :object => @annotation %>
        </div>
    </div>
</div>

<div class="col-md-8" id="file">
    <%= content_tag :iframe, nil, src: pdf_annotation_path(@annotation), width: "100%", height: "875px", frameBorder: "0" %>
</div>
</div>

<% if advancedtagging = '1' %>
<div class="row">
    <%= render 'tags/advanced', :object => @annotation %>
</div>
<% end -%>

Answer 1

将 ID 添加到您的div和复选框

<div id="mydiv" class="row">
    <%= render 'tags/advanced', :object => @annotation %>
</div>

使用Jquery

$(function() {
  $('#mycheckbox').click(function(event){
    event.preventDefault();
    $('div#mydiv').toggle();
  });
});

添加CSS文件div.hidden { display: none; }

使用纯js

添加一些js文件，例如application.js或其他你想要的

$(function() {
    var mycheckbox = document.getElementById('mycheckbox');
    var mydiv = document.getElementById('mydiv');
    var toggleDiv = function(){
        if(mycheckbox.checked) {
            mydiv.style['display'] = 'block';
        } else {
            mydiv.style['display'] = 'none';
        }
    }
    mycheckbox.onclick = toggleDiv;
    toggleDiv();
});

Rails 5 - 在复选框上显示块

1 个答案: