एक रेल लिंक के साथ एक डीवी कैसे क्लिक करने योग्य क्लिक करें?</p> <pre><code>.limeskin:hover { background: #eee; cursor: pointer; display: block; } </code></pre> <p>कि मैं क्लिक करने योग्य होना चाहते हैं:

Question

मैं एक बड़ी div है। क्योंकि मैं रेल उपयोग कर रहा हूँ मैं एक रेल लिंक क्लिक करने योग्य हो की आवश्यकता है: उदाहरण

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

यह <a> टैग के साथ div चारों ओर जाएगा।

प्रलेखन: http://apidock.com/rails/ActionView/Helpers/UrlHelper/link_to

या यदि आप एक बड़ा div है और बनाना चाहते यह "क्लिक करने योग्य", 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

उपयोग जावास्क्रिप्ट (मैं jQuery की सिफारिश) वास्तव में कार्रवाई करने के लिए और सीएसएस 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; 

}