Как сделать DIV с Rails Link кликабельным?

Question

У меня есть большой DIV:

.limeskin:hover { 
    background: #eee; 
    cursor: pointer; 
    display: block; 
} 

, что я хочу быть интерактивными. Так как я использую Rails мне нужно иметь ссылку Rails быть интерактивными: Например

<%= link_to 'Edit Your Email Address', edit_user_path %> 

Я изо всех сил на это.

Вот весь блок:

<% @user.posts.each do |post| %> 
    <div class="lists"> 
     <ol class="limeposts"> 
     <li> 
     <div class="limeskin"> 
      <div class="limebox"> 
      <div class="limecost"> 
       <b>Price:</b> 
       <%= number_to_currency(post.price, :unit => "R") %><br> 
       [...] 
<% end %> 

Все простые юридические работоспособные ответы?

Благодаря

Answer 1

link_to может принять блок:

<%= link_to root_path do %> 
    <div>Hey!</div> 
<% end %> 

Это будет окружать DIV с <a> тегами.

Документация: http://apidock.com/rails/ActionView/Helpers/UrlHelper/link_to

Или если у вас есть большой ДИВ и хотите, чтобы сделать его "кликабельны", с помощью JQuery:

# html.erb 
<div class="limeskin"> 
    <div class="limebox"> 
    <div class="limecost"> 
     <b>Price:</b> 
     <%= number_to_currency(post.price, :unit => "R") %><br> 
     #[...] 
    </div> 
    </div> 
</div> 

# jQuery.js 
$('.limeskin').click(function(event) { 
    var clicked_div = $(this); 
    # do stuff with the event object and 'this' which 
    # represent the element you just clicked on 
}); 

jsFiddle: http://jsfiddle.net/Lxw34w5o/1/

Answer 2

Использование Javascript (я рекомендую JQuery), чтобы сделать действие действительно, и селектор CSS hover для изменения фона div и курсора (чтобы изменить курсор со стрелки на ручку).

Answer 3

Использование LINK_TO как ниже будет достаточно, даже если у вас есть большой блок, включающий в нескольких тегов:

<%= link_to desired_path do %> 
    <div class="linkable"> 
     <another div> 
      ... some other tags 
     </another div> 
    </div> 
<% end %> 

и я рекомендую вам использовать различные цвета фона для мыши над событиями, потому что он показывает зрителю, что это ссылка!

В вас .css файле:

.linkable:hover{ 
    background-color: red; 

}