Rails html 视图，定位一个元素并使其仅对一个视图不可见。
Posted
技术标签:
【中文标题】Rails html 视图，定位一个元素并使其仅对一个视图不可见。【英文标题】：Rails html view, target one element and make it invisible for one view only. 【发布时间】：2016-07-27 13:07:37 【问题描述】：我正在寻找我当前在“application.html.erb”布局视图中的图像，因此它仅在显示“adventures/index.html.erb”视图时显示。我尝试在css文件'adventures.scss'中使用代码#nav_img display: none; ，但这不起作用，如果我在'application.scss'样式表中写了这个，它会禁用每个页面的图像 - 我只想要它在“adventure.index.html.erb”视图中不可见。非常感谢。
Application.html.erb 文件：
<!DOCTYPE html>
<html>
<head>
<title>TFAA</title>
<%= csrf_meta_tags %>
<%= stylesheet_link_tag 'application','http://yui.yahooapis.com/2.8.1/build/reset/reset-min.css' %>
<%= stylesheet_link_tag 'application', media: 'all', 'data-turbolinks-track': 'reload' %>
<%= javascript_include_tag 'application', 'data-turbolinks-track': 'reload' %>
<link href='https://fonts.googleapis.com/css?family=Indie+Flower' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,600' rel='stylesheet' type='text/css'>
</head>
<body>
<div class="container">
<!-- ================= nav bar ================= -->
<nav class="nav_bar">
<div class="nav_logo">
<%= link_to image_tag("nav_logo.png", id: "nav_img"), root_path %>
</div>
<ul class="nav_links">
<% if user_signed_in? %>
<li>
<%= button_to "Log out", destroy_user_session_path, id: 'button_log_out', class: 'button', method: :delete %>
</li>
<% else %>
<li>
<%= button_to "Log in", new_user_session_path, id: 'button_log_in', class: 'button', method: :get %>
</li>
<li>
<%= button_to "Sign up", new_user_registration_path, id: 'button_sign_up', class: 'button', method: :get %>
</li>
<% end %>
</ul>
</nav>
<!-- ================= flash notices ================= -->
<p class="notice"><%= notice %></p>
<p class="alert"><%= alert %></p>
<%= yield %>
</div>
</body>
</html>冒险/index.html.erb 文件：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>Adventure</title>
</head>
<body>
<div class="adventure_logo">
<%= image_tag "nav_logo.png", id: 'main_logo' %>
</div>
<% @adventures.each do |adventure|%>
<%= link_to "#adventure.title", adventure_path(adventure.id), class: 'adventure' %>
<% end %>
</body>
</html> body
font-family: 'Source Sans Pro', sans-serif;
.container
margin: 2%;
background-color: lightgrey;
// ============= nav bar ==============
.nav_bar
border: 1px solid blue;
height: 100px;
width: 100%;
display: flex;
justify-content: space-between;
.nav_logo
border: 2px dashed orange;
#nav_img
width: 300px;
.nav_links
display: flex;
justify-content: center;
align-items: center;
border: 1px solid lightgreen;
width: 30%;
.button
margin: 5px;
padding: 10px;
border-radius: 13px;
border: none;
color: white;
font-family: 'Indie Flower', cursive;
font-weight: 200;
text-decoration: none;
#button_log_in
background-color: #8b0407;
width: 100px;
#button_sign_up
background-color: #333333;
width: 100px;
// ============= forms ==============
.sign_up_form
border: 1px solid green;
.sign_up_h2
border: 1px solid pink;
.sign_in_link
border: 1px solid yellow;
.sign_up_link
border: 1px solid purple;
.forgot_password
border: 1px solid brown;
// ============= adventures ==============
.adventure
border: 1px solid yellow;
.adventure_logo
margin: 0 auto;
width: 70%;
display: flex;
justify-content: center;
align-items: center;
border: 1px dashed orange;
#main_logo
max-width: 100%;
height: auto;
width: 70%;
adventures.scss 文件：
#nav_img
display: none;
【问题讨论】：
你用 jquery 试过了吗？ 不，恐怕我对在 Rails 中使用 jquery 不太熟悉。我希望这只是一个简单的“将哪段代码放入哪个文件”的问题。 你愿意把那张图片放在局部吗？ 【参考方案1】：使用current_page? helper 检查页面
<% unless current_page?(controller: 'adventures', action: 'index') %>
<%= link_to image_tag("nav_logo.png", id: "nav_img"), root_path %>
<% end %>
【讨论】：
【参考方案2】：试试这个，它会显示除adventures/index.html.erb页面之外的图像
<% unless current_page?(controller: 'adventures', action: 'index')%>
<div class="nav_logo">
<%= link_to image_tag("nav_logo.png", id: "nav_img"), root_path %>
</div>
<%end%>
如果您只想在adventures/index.html.erb 页面上显示图像，那么您必须执行以下代码
<% if current_page?(controller: 'adventures', action: 'index')%>
<div class="nav_logo">
<%= link_to image_tag("nav_logo.png", id: "nav_img"), root_path %>
</div>
<%end%>
【讨论】：
为此干杯。我可以做这样的事情吗？<% if current_page?(controller: 'adventures', action: 'index' %> <div class="nav_logo_container"> <%= link_to image_tag "nav_logo.png", id: "nav_logo", style: "display: none;" %> </div> <% end %>
是的，那么它将只在adventures/index.html.erb页面上显示图像
我更新了答案，如果它解决了您的问题，请接受答案。以上是关于Rails html 视图，定位一个元素并使其仅对一个视图不可见。的主要内容，如果未能解决你的问题，请参考以下文章
单击表视图使其仅在第一次单击时附加字符串，而不是在 didSelectRowAtIndexPath 中的另一次单击时附加字符串