我有一個大的div：如何使Rails Link可點擊的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 %>

任何簡單的法律可行的答案？

感謝

來源

2013-06-25 Erin Walker

link_to可以接受塊：

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

這將環繞在div與<a>標籤。

文檔：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/

來源

2013-06-25 18:07:13 MrYoshiji

謝謝嗨，這讓limeface和limcost DIV內容點擊，但僅此而已。我希望整個塊（參見添加樣式表）可以點擊石灰皮。 –

好吧給我一秒我會用jQuery發佈一個解決方案 – MrYoshiji

剛剛更新了我的答案@ErinWalker – MrYoshiji

使用JavaScript（我推薦的jQuery ）使動作實際發生，CSS hover選擇器修改div背景和光標（將光標從箭頭更改爲手）。

來源

2013-06-25 19:27:35 bluehallu

使用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; 

}

來源

2016-04-15 06:15:03

當我在我的index.html.erb文件中這樣做時，這行實際上根本不顯示。你知道可能導致什麼嗎？ –

@AbbeyJackson檢查你的代碼，並確保使用<％= not <％ –

是的，我直接從這裏複製它，以確保 –

如何使Rails Link可點擊的DIv？

回答

的jsfiddle：http://jsfiddle.net/Lxw34w5o/1/

相關問題