Come rendere cliccabile un DIV con un collegamento Rails?

Question

Ho un grande div:

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

che voglio essere cliccabile. Perché sto utilizzando Rails ho bisogno di avere un collegamento Rails essere cliccabile: Per esempio

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

sto lottando per questo.

Ecco l'intero blocco:

<% @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 %> 

Qualsiasi semplici risposte praticabili legali?

Grazie

Answer 1

link_to possono accettare un blocco:

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

Questa circonderà il div con <a> tags.

Documentazione: http://apidock.com/rails/ActionView/Helpers/UrlHelper/link_to

Oppure, se si dispone di un grande div e vuole rendere "cliccabile", utilizzando 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

usare javascript (mi raccomando jQuery) per rendere effettivamente possibile l'azione e il selettore CSS hover per modificare lo sfondo div e il cursore (per cambiare il cursore da una freccia a una mano).

Answer 3

Usando link_to come di seguito sarebbe sufficiente anche quando si dispone di un grande blocco tra cui più tag:

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

e vi consiglio di utilizzare un colore di sfondo diverso per il mouse sopra gli eventi perché mostra allo spettatore che si tratta di un collegamento!

In te css File:

.linkable:hover{ 
    background-color: red; 

}