Question

我有一个滑轨表格。当选中一个复选框（数据库中为true）时，我想使div隐藏。我找到了其他解决方案，但在重新加载页面时，它又出现了，如果选中或为true，我想使div隐藏。

x&(5) = x&(5) + 1

我知道此脚本将不起作用，但是一直在尝试几个不同的示例来解决我的问题。

  <div class="form-group">
    <%= form.check_box :tos_checkbox, class: "terms_of_services" %>
    <%= form.label :tos_checkbox, "Agree to TOS" %>
  </div>

  <div id="hide_if_above_checked">
    Do You Agree to Our TOS
  </div>

Answer 1

要保留数据，您需要使用window.localStorage，window.sessionStorage或document.cookie

甚至您的后端都可以访问Cookie

Answer 2

从db调用复选框值，并在渲染时检查

 <%if @variable_of_current_model.tos_checkbox != 'true' %>
  <div id="hide_if_above_checked">
   Do You Agree to Our TOS
 </div>
<% end %>

div#hide_if_above_checked仅在数据库不正确时显示。

Answer 3

您可以在页面加载时获取复选框的值。

if ($(".terms_of_services").is(':checked')){
  $("#some-div-box").hide();
}else{
  $("#some-div-box").show();
}

通过这种方式，如果选中了复选框，则可以隐藏div。

Answer 4

添加到CSS

.hidden-div {
  display: none;
}

然后

<div id="hide_if_above_checked" class="<%= 'hidden-div' if tos_checkbox %>">
  Do You Agree to Our TOS
</div>

如果选中了复选框，则即使重新加载页面也要保持DIV隐藏

4 个答案: