【问题标题】:How to wrap a list item in a link_to?如何将列表项包装在 link_to 中?
【发布时间】:2015-01-26 02:34:52
【问题描述】:

目前,只有文本是可点击的,并且将用户带到应用程序中的指定路线,而点击 li 下拉列表的任何其他部分都不会产生任何结果。

代码如下:

<li id='dropdown'>
    <%= current_user.email %> ▾
        <ul id='dropdown-list'>
             <li> <%= link_to "My Account", current_user %> </li>
            <li><%= link_to "Log Out", session_path("current"), method: :delete %></li>
        </ul>
</li>

这是css:

#dropdown-list {
  padding: 0;
  position: absolute;
  top: 48px;
  width: 150px;
  -webkit-box-shadow: none;
  -moz-box-shadow: none;
  box-shadow: 0px 2px 5px #bcbfc3;
  display: block;
  opacity: 0;
  visibility: hidden;
  -webkit-transiton: opacity 0.2s;
  -moz-transition: opacity 0.2s;
  -ms-transition: opacity 0.2s;
  -o-transition: opacity 0.2s;
  -transition: opacity 0.2s;
}

#dropdown-list li { 
  background: #fff; 
  display: block; 
  color: #7D818A;
}
#dropdown-list li:hover{
 background-color: #ECECEE; 
}

#dropdown:hover ul {
  display: block;
  opacity: 1;
  visibility: visible;
}

【问题讨论】:

    标签: css ruby-on-rails ruby


    【解决方案1】:

    您可以通过创建这样的块来包装link_to

    <%= link_to(current_user) do %>
    ...stuff to wrap here...
    <%=end%>
    

    我想你可能会想要这样的东西:

    <li id='dropdown'>
        <%= current_user.email %> ▾
            <ul id='dropdown-list'>
              <%= link_to(current_user) do %>
                 <li>My Account</li>
              <%= end %>
                <li><%= link_to "Log Out", session_path("current"), method: :delete %></li>
            </ul>
    </li>
    

    【讨论】:

    【解决方案2】:

    CSS 解决方案:

    #dropdown-list>li>a{
      display: block;
    }
    

    【讨论】:

      猜你喜欢
      • 1970-01-01
      • 2010-12-16
      • 1970-01-01
      • 2019-12-07
      • 2012-02-18
      • 1970-01-01
      • 1970-01-01
      • 1970-01-01
      • 2016-03-22
      相关资源
      最近更新 更多